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

Legend.item.markers.border

configuration

The border of the markers.

legend.item.markers.border

Object|Function

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  legend: {
    item: {
      markers: {
        border: {
          color: "red",
          width: 2,
          dashType: "solid"
        }
      }
    }
  },
  series: [
    { name: "Series 1", data: [1, 2, 3] },
    { name: "Series 2", data: [4, 5, 6] }
  ]
});
</script>

legend.item.markers.border.color

String|Function

The configuration of the Chart legend item markers border.

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  legend: {
    item: {
      markers: {
        border: {
          color: "green",
          width: 1
        }
      }
    }
  },
  series: [
    { name: "Series 1", data: [1, 2, 3] },
    { name: "Series 2", data: [4, 5, 6] }
  ]
});
</script>

legend.item.markers.border.dashType

String

The dash type of the legend item border.

The following dash types are supported:

"dash" - a line consisting of dashes
"dashDot" - a line consisting of a repeating pattern of dash-dot
"dot" - a line consisting of dots
"longDash" - a line consisting of a repeating pattern of long-dash
"longDashDot" - a line consisting of a repeating pattern of long-dash-dot
"longDashDotDot" - a line consisting of a repeating pattern of long-dash-dot-dot
"solid" - a solid line

<div id="chart"></div>
<script>
$("#chart").kendoChart({
  legend: {
    item: {
      markers: {
        border: {
          dashType: "dashDot",
          color: "blue",
          width: 2
        }
      }
    }
  },
  series: [
    { name: "Series 1", data: [1, 2, 3] },
    { name: "Series 2", data: [4, 5, 6] }
  ]
});
</script>