Chart Legend - reduce margin/padding

[Kindred]

Hi,

I have a chart with big checkboxes for mobile. 

Unfortunately it takes a lot of space on my chart so I'd like to reduce the gap between each legends. (see screenshot).

I tried to change legend.label.margin = 0 and legend.label.padding = 0, without success.

 

The code to generate my legend looks like this:

"legend": {
                    "position": "bottom",
                    "labels": {
                        "color": "#5d707c",
                        "font": title_legend_font_size,
                        "margin": 0,
                        "padding": 0,
                    },
                    "item": {
                        visual: function(e) {
                            var color = e.options.markers.background;
                            var labelColor = e.options.labels.color;
                            var rect = new kendo.geometry.Rect([0, 0], [350, 100]);
                            var layout = new kendo.drawing.Layout(rect, {
                                spacing: 5,
                                alignItems: "center"
                            });
                            var cbSymbol = e.active ? "☑" : "☐";
                            var cb = new kendo.drawing.Text(cbSymbol, [0, 0], {
                                fill: {
                                    color: labelColor
                                },
                                font: checkbox_font_size
                            });
                            var defaultVisual = e.createVisual();
                            layout.append(cb, defaultVisual);
                            layout.reflow()
                            return layout;
                        }
                    }
                },

 

[Kindred]

Sorry there doesn't seem to be any edit option.
Just to clarify what I meant is to reduce the gap between each labels of the legend.

So the whole legend container would be smaller.

[Stamo Gochev]

Hi Kindred,

What I can suggest is to decrease the value of the "checkbox_font_size" variable as it creates a larger box for the legend items. The margin/padding properties won't work in this case as they apply to the built-in visual, but the checkboxes are new elements.

Regards,
Stamo Gochev
Progress Telerik