Pre loader

Single Legend entry for multiple Lines

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

0
0

Currently I’m using line series to render data of two different types. But when using legend, a separate entry is made for each line. I want a single legend for each data type.

const {sciChartSurface, wasmContext} = await SciChart.SciChartSurface.create("scichart-root");

        sciChartSurface.xAxes.add(new SciChart.NumericAxis(wasmContext));
        sciChartSurface.yAxes.add(new SciChart.NumericAxis(wasmContext));

        for (let i = 0; i < 5; i++) {
            const xValues = [1, 2, 3, 4, 5];
            const yValues = xValues.map(x => x * (i + 1));
            const dataSeries = new SciChart.XyDataSeries(wasmContext, { xValues, yValues, dataSeriesName: "file 1" });

            const lineSeries = new SciChart.FastLineRenderableSeries(wasmContext, {
                dataSeries,
                stroke: "red",
                strokeThickness: 2,
            });
            sciChartSurface.renderableSeries.add(lineSeries);
        }

        for (let i = 0; i < 5; i++) {
            const xValues = [1, 2, 3, 4, 5];
            const yValues = xValues.map(x => x * (i + 10));
            const dataSeries = new SciChart.XyDataSeries(wasmContext, { xValues, yValues, dataSeriesName: "file 2" });

            const lineSeries = new SciChart.FastLineRenderableSeries(wasmContext, {
                dataSeries,
                stroke: "blue",
                strokeThickness: 2,
            });
            sciChartSurface.renderableSeries.add(lineSeries);
        }

        const legendModifier = new SciChart.LegendModifier({
            placement: SciChart.ELegendPlacement.TopRight,
            orientation: SciChart.ELegendOrientation.Vertical,
            showLegend: true,
            showCheckboxes: true,
            showSeriesMarkers: true,
        });

        legendModifier.getLegendData = () => {
            return [{
                seriesName: "Grouped Lines",
                stroke: "#000000",
                seriesType: "LineSeries"
            }];
        };

        sciChartSurface.chartModifiers.add(legendModifier);
Version
3.3.560
Images
  • You must to post comments
Showing 0 results
Your Answer

Please first to submit.