Chart legend line type not correct

1 Answer 37 Views
Charts
Claudio
Top achievements
Rank 1
Iron
Iron
Claudio asked on 18 Mar 2022, 10:40 AM

Good morning,

creating a graph with a single data series, we found that, although the series is graphed with a dash-dot type, the same type is not shown in the legend (see attachment).

Is there an option to report the same type of line in the legend or do you have a work around to suggest to set it up?

Thank you,

1 Answer, 1 is accepted

Sort by
1
Accepted
Nikolay
Telerik team
answered on 23 Mar 2022, 07:27 AM

Hi Claudio,

I am afraid the current API of the Chart does not expose a property for setting the dash type of the legend items.

However, you can use a legend.item.visual function and create a line similar to the desired. For example:

        visual: function (e) {
          var color = e.options.markers.background;
          var labelColor = e.options.labels.color;
          var rect = new kendo.geometry.Rect([0, 0], [100, 50]);
          var layout = new kendo.drawing.Layout(rect, {
            spacing: 5,
            alignItems: "center"
          });

          var marker = new kendo.drawing.Path({
            fill: {
              color: color
            }
          }).lineTo(17, 10).lineTo(8, 10).close();
          
          var marker2 = new kendo.drawing.Path({
            fill: {
              color: color
            }
          }).lineTo(5, 10).lineTo(4, 10).close();

          var label = new kendo.drawing.Text(e.series.name, [0, 0], {
            fill: {
              color: labelColor
            }
          });

          layout.append(marker, marker2, label);
          layout.reflow()

          return layout;
        }

Here is a Dojo demo demonstrating the above: https://dojo.telerik.com/aNicIxec

Let me know if you have any questions.

Regards,
Nikolay
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Claudio
Top achievements
Rank 1
Iron
Iron
commented on 24 Mar 2022, 11:13 AM

Hi Nikoly,

 

whit some adjustment, it works fine for me.

 

Thank you

Tags
Charts
Asked by
Claudio
Top achievements
Rank 1
Iron
Iron
Answers by
Nikolay
Telerik team
Share this question
or