This is a migrated thread and some comments may be shown as answers.

Boxes not aligning on side of legend

2 Answers 42 Views
Charts
This is a migrated thread and some comments may be shown as answers.
Dalton
Top achievements
Rank 1
Dalton asked on 04 Feb 2016, 08:58 PM

Hello, I've ran into a problem with my legend. I need the boxes to align to the left side of each of the legend. Here is my code:

 

legend:{
                position: "bottom",
                item: {
                    visual: function (e) {
                        var color = e.options.markers.background;
                        var labelColor = e.options.labels.color;
                        var rect = new kendo.geometry.Rect([0, 0], [150, 100]);
                        var layout = new kendo.drawing.Layout(rect, {
                            alignItems: "right"
                        });

                        var marker = new kendo.drawing.Path({
                            fill: {
                                color: color
                            },
                            stroke: {
                                color: color
                            },
                        }).moveTo(40, 0).lineTo(40, 35).lineTo(5, 35).lineTo(5, 0).close();

                        var label = new kendo.drawing.Text(e.series.name, [10, 0], {
                            fill: {
                                color: labelColor
                            },
                            font: "30px sans-serif",
                        });

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

                        return layout;
                    }
                }

 

Any ideas?

2 Answers, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 08 Feb 2016, 04:35 PM
Hello Dalton,

In order to avoid the issue you could increase the rect width. For your convenience here is a basic dojo.

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Dalton
Top achievements
Rank 1
answered on 08 Feb 2016, 05:03 PM
Thank you, it worked.
Tags
Charts
Asked by
Dalton
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
Dalton
Top achievements
Rank 1
Share this question
or