Boxes not aligning on side of legend

[Dalton]

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?

[Iliana Dyankova]

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

 

 

[Dalton]

Thank you, it worked.