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

State.legend

configuration

The chart legend configuration options.

state.legend

Object

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        legend: {
            position: "bottom",
            visible: true,
            labels: {
                color: "#333",
                font: "12px Arial"
            }
        }
    }
});
</script>

state.legend.labels

Object

The chart legend label configuration.

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        legend: {
            labels: {
                color: "#444",
                font: "11px Verdana"
            }
        }
    }
});
</script>

state.legend.position

String

The positions of the chart legend.

The supported values are:

"top" - the legend is positioned on the top.
"bottom" - the legend is positioned on the bottom.
"left" - the legend is positioned on the left.
"right" - the legend is positioned on the right.
"custom" - the legend is positioned using legend.offsetX and legend.offsetY.

Default: "right"

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        legend: {
            position: "top"
        }
    }
});
</script>

state.legend.visible

Boolean

If set to true the chart will display the legend. By default the chart legend is visible.

Default: true

<div id="chart-wizard"></div>
<script>
$("#chart-wizard").kendoChartWizard({
    state: {
        legend: {
            visible: false
        }
    }
});
</script>

State.legend

state.legend

state.legend.labels

state.legend.position

state.legend.visible

Related Members