panes Array

The chart panes configuration.

Panes are used to split the chart in two or more parts. The panes are ordered from top to bottom.

Each axis can be associated with a pane by setting its pane option to the name of the desired pane. Axis that don't have specified pane are placed in the top (default) pane.

Series are moved to the desired pane by associating them with an axis.

Example - configure the chart panes

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  series: [
    { data: [1, 2, 3] },
    { data: [1, 2, 3, 4], axis: "bottom" }
  ],
  valueAxis: [
    { pane: "top-pane" },
    { pane: "bottom-pane", name: "bottom" }
  ],
  panes: [
    { name: "top-pane" },
    { name: "bottom-pane" }
  ]
});
</script>

Related Properties

• panes.background
• panes.border
• panes.border.color
• panes.border.dashType
• panes.border.width
• panes.clip
• panes.height
• panes.margin
• panes.margin.bottom
• panes.margin.left
• panes.margin.right
• panes.margin.top
• panes.name
• panes.title
• panes.title.background
• panes.title.border
• panes.title.border.color
• panes.title.border.dashType
• panes.title.border.width
• panes.title.color
• panes.title.font
• panes.title.margin
• panes.title.margin.bottom
• panes.title.margin.left
• panes.title.margin.right
• panes.title.margin.top
• panes.title.position
• panes.title.text
• panes.title.visible
• panes.title.visual
• panes.padding
• panes.padding.bottom
• panes.padding.left
• panes.padding.right
• panes.padding.top