Making dashed legend marker

[kkoroleva]

Hi there.

I have two line diagrams with the same color, but different line type. How can I divide them in legend?
I have tried to add legendMarkerType: ‘triangle’, legendMarkerColor: ‘white’, markerSize: 1, but it doesn’t work. Here is my chart config:

Am I missing something?

It looks like this:

Thanks in advance for all the help

[kkoroleva]

Here is my chart config:

export const DEFAULT_CHART_OPTIONS = {
  theme: ChartConstants.THEME,
  animationEnabled: true,
  options: {
    scales: {
      y: {
        stacked: true,
      },
    },
  },
  title: {
    text: '',
  },
  axisX: {
    valueFormatString: '',
    interval: 1,
    intervalType: 'month',
  },
  axisY: {
    title: '',
    suffix: '',
  },
  toolTip: {
    shared: 'true',
  },
  legend: {
    cursor: ChartConstants.CURSOR,
  },
  data: [],
};

and here is the exact line config:

  predictGraph: {
    markerSize: 1,
    showInLegend: true,
    dataPoints: [],
    name: TextConstants.PREDICT,
    type: ChartConstants.LINE_TYPE,
    lineDashType: ChartConstants.DASH_TYPE,
    legendMarkerType: 'triangle',
    legendMarkerColor: 'white',
    color: ChartConstants.SECOND_LINE_COLOR,
    xValueType: 'dateTime',
  }

[Ananya]

@kkoroleva,

Setting legendMarkerType as ‘triangle’, and legendMarkerColor as ‘white’ seems to be working fine, and creates a dashed line legend marker. You can take a look this JSFiddle for the complete example.

If you are still facing any issue, please share a JSFiddle reproducing your use case, so that we can look into it and help you out.

—
Ananya Deka
Team CanvasJS

• This reply was modified 1 month, 3 weeks ago by Vishwas R.
• This reply was modified 1 month, 3 weeks ago by Ananya.