Chart Legend and Datalabels

[TaeWook Kang]

Q1.ChartLegend

I want to change the color of the chart legend.

The chart name was declared a variable.

I want to change the color of a specific part of the chart legend.

@{
  var scheduleDelay = "";
    if (ViewBag.scheduleDelay > 0)
    {
        var total = " (Total:" + ViewBag.scheduleDelay + ")";
        scheduleDelay = "Delay" + total;
    }
}

Here, I want to change only the color of the 'total' variable and display it.

Q2. Datalabel

I have a question when I use the data label template.

I want to express data labels in one group.

The corresponding chart of the delay is a value expressed only by a data label without expressing a value.

I want to express the data label like a picture.

It is difficult to adjust the location with each template.

Below is the chart code.

 <ejs-chart id="Deliverable" width="85%" height="300" title="Deliverable" palettes="Deliverablecolor">
                                <e-chart-legendsettings visible="true" position="Left" toggleVisibility="false"></e-chart-legendsettings>
                                <e-chart-chartarea>
                                    <e-chartarea-border width="0"></e-chartarea-border>
                                </e-chart-chartarea>
                                <e-chart-primaryxaxis valueType="Category" interval="0">
                                    <e-majorgridlines width="0"></e-majorgridlines>
                                </e-chart-primaryxaxis>
                                <e-chart-primaryyaxis>
                                    <e-majorgridlines width="0"></e-majorgridlines>
                                    <e-majorticklines width="0"></e-majorticklines>
                                    <e-linestyle width="0"></e-linestyle>
                                    <e-labelstyle color="transparent"></e-labelstyle>
                                </e-chart-primaryyaxis>
                                <e-series-collection>
                                    <e-series dataSource="@ViewBag.scheduleDelayData" xName='month' yName='yValue' name='@scheduleDelay' width=0 visible="true" legendShape="Circle">
                                        <e-series-marker>
                                            <e-series-datalabel visible="false" position="Outer">
                                                <e-font fontWeight="400" color="#000000"></e-font>
                                            </e-series-datalabel>
                                        </e-series-marker>
                                    </e-series>
                                    <e-series dataSource="@ViewBag.scheduleDelayData" xName='month' yName='yValue1' name='Plan' width=1 type="@Syncfusion.EJ2.Charts.ChartSeriesType.Column" legendShape="Circle">
                                        <e-series-marker>
                                            <e-series-datalabel visible="true" position="Outer">
                                                <e-font fontWeight="400" color="#000000"></e-font>
                                            </e-series-datalabel>
                                        </e-series-marker>
                                    </e-series>
                                    <e-series dataSource="@ViewBag.scheduleDelayData" xName='month' yName='yValue2' name='Issued' width=1 type="@Syncfusion.EJ2.Charts.ChartSeriesType.Column" legendShape="Circle">
                                        <e-series-marker>
                                            <e-series-datalabel visible="true" position="Outer">
                                                <e-font fontWeight="400" color="#000000"></e-font>
                                            </e-series-datalabel>
                                        </e-series-marker>
                                    </e-series>
                                </e-series-collection>
                            </ejs-chart>

[Swetha Babu]

Hi TaeWook,

Greetings from Syncfusion.

We can render the color for the text by using the color property in the textStyle of the legendSettings in the chart. So, we do not have support to set the color for one part of the legend text and support for the grouping data label in chart.

Regards,

Swetha