New to Kendo UI for jQuery? Start a free 30-day trial

Legend.title.padding

configuration

The padding of the title. A numeric value will set all margins.

legend.title.padding

Number|Object

Default: 5

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    dataSource: {
        data: [{
            date: new Date(2016, 0, 1),
            close: 41,
            volume: 2632000
        }, {
            date: new Date(2016, 0, 2),
            close: 42,
            volume: 2631000
        }]
    },
    series: [{
        field: "close",
        name: "Price"
    }],
    legend: {
        visible: true,
        title: {
            text: "Stock Chart",
            padding: 10
        }
    }
});
</script>

legend.title.padding.bottom

Number

The bottom padding of the title.

Default: 0

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    dataSource: {
        data: [{
            date: new Date(2016, 0, 1),
            close: 41,
            volume: 2632000
        }, {
            date: new Date(2016, 0, 2),
            close: 42,
            volume: 2631000
        }]
    },
    series: [{
        field: "close",
        name: "Price"
    }],
    legend: {
        visible: true,
        title: {
            text: "Stock Chart",
            padding: {
                bottom: 8
            }
        }
    }
});
</script>

legend.title.padding.left

Number

The left padding of the title.

Default: 0

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    dataSource: {
        data: [{
            date: new Date(2016, 0, 1),
            close: 41,
            volume: 2632000
        }, {
            date: new Date(2016, 0, 2),
            close: 42,
            volume: 2631000
        }]
    },
    series: [{
        field: "close",
        name: "Price"
    }],
    legend: {
        visible: true,
        title: {
            text: "Stock Chart",
            padding: {
                left: 12
            }
        }
    }
});
</script>

legend.title.padding.right

Number

The right padding of the title.

Default: 0

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    dataSource: {
        data: [{
            date: new Date(2016, 0, 1),
            close: 41,
            volume: 2632000
        }, {
            date: new Date(2016, 0, 2),
            close: 42,
            volume: 2631000
        }]
    },
    series: [{
        field: "close",
        name: "Price"
    }],
    legend: {
        visible: true,
        title: {
            text: "Stock Chart",
            padding: {
                right: 15
            }
        }
    }
});
</script>

legend.title.padding.top

Number

The top padding of the title.

Default: 0

<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
    dataSource: {
        data: [{
            date: new Date(2016, 0, 1),
            close: 41,
            volume: 2632000
        }, {
            date: new Date(2016, 0, 2),
            close: 42,
            volume: 2631000
        }]
    },
    series: [{
        field: "close",
        name: "Price"
    }],
    legend: {
        visible: true,
        title: {
            text: "Stock Chart",
            padding: {
                top: 10
            }
        }
    }
});
</script>