Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(declarative-chart): Support for Dashed line #33691

Closed
wants to merge 17 commits into from

Conversation

Anush2303
Copy link
Contributor

Previous Behavior

No support for dashed line.

New Behavior

  1. image

  2. image

Related Issue(s)

  • Fixes #

@Anush2303 Anush2303 changed the base branch from master to user/atisjai/stronglyTypePlotly January 20, 2025 15:58
@Anush2303 Anush2303 marked this pull request as ready for review January 20, 2025 15:58
@Anush2303 Anush2303 requested a review from a team as a code owner January 20, 2025 15:58
@@ -281,6 +281,9 @@ export const transformPlotlyJsonToVSBCProps = (
const color = getColor(legend, colorMap, isDarkTheme);
mapXToDataPoints[x].lineData!.push({
legend,
lineOptions: ['dot', 'dash', 'longdash', 'dashdot', 'longdashdot'].includes(series.line?.dash as Dash)
? { strokeDasharray: '5', strokeLinecap: 'butt', strokeWidth: '2', lineBorderWidth: '4' }
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lets use the same dash type as provided by plotly.
dot = dot representation and so on
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dasharray

@@ -29,7 +29,7 @@ import { DataVizPalette, getNextColor } from '../../utilities/colors';
import { GaugeChartVariant, IGaugeChartProps, IGaugeChartSegment } from '../GaugeChart/index';
import { IGroupedVerticalBarChartProps } from '../GroupedVerticalBarChart/index';
import { IVerticalBarChartProps } from '../VerticalBarChart/index';
import { Layout, PlotlySchema, PieData, PlotData, SankeyData } from './PlotlySchema';
import { Layout, PlotlySchema, PieData, PlotData, SankeyData, Dash } from './PlotlySchema';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you address this also. #33621 (review)

@@ -470,6 +473,9 @@ export const transformPlotlyJsonToScatterChartProps = (

return {
legend,
lineOptions: ['dot', 'dash', 'longdash', 'dashdot', 'longdashdot'].includes(series.line?.dash as Dash)
? { strokeDasharray: '5', strokeLinecap: 'butt', strokeWidth: '2', lineBorderWidth: '4' }
: {},
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also resolve the colormap pending comments

@Anush2303 Anush2303 changed the base branch from user/atisjai/stronglyTypePlotly to master January 21, 2025 04:12
@Anush2303 Anush2303 closed this Jan 21, 2025
@Anush2303 Anush2303 deleted the usr/agupta/dashedLine branch January 21, 2025 04:20
@Anush2303
Copy link
Contributor Author

Closing this PR. Will create a new one.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants