series.line String|Object
The chart line configuration options.
The
line
option is supported when the series.type option is set to "area", "candlestick", "ohlc" or "waterfall".
Example - configure the chart line options
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [ {
type: "area",
line: {
color: "green",
width: 5
},
data: [1, 2, 3]
}]
});
</script>
series.line.color String
The line color. Accepts a valid CSS color string, including hex and rgb.
Example - set the chart line color
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [ {
type: "area",
line: {
color: "green",
width: 5
},
data: [1, 2, 3]
}]
});
</script>
series.line.opacity Number
(default: 1)
The line opacity. By default the line is opaque.
Example - set the chart line opacity
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [ {
type: "area",
line: {
color: "green",
opacity: 0.5,
width: 5
},
data: [1, 2, 3]
}]
});
</script>
series.line.width Number
(default: 4)
The line width in pixels.
Example - set the chart line width
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [{
type: "area",
line: {
color: "green",
opacity: 0.5,
width: 5
},
data: [1, 2, 3]
}]
});
</script>
series.line.style String
(default: "normal")
The supported values are:
- "normal" - The values will be connected with straight line.
- "step" - The values will be connected with a line with right angle.
- "smooth" - The values will be connected with a smooth line.
The default value is "normal".
The
style
option is supported when series.type is set to "area", "rangeArea", "polarArea" or "radarArea".The
step
value is supported only when series.type is set to "area" or "rangeArea".For line series, use series.style.
Example - set the chart line width
<div id="chart"></div>
<script>
$("#chart").kendoChart({
series: [{
type: "area",
line: {
color: "green",
opacity: 0.5,
width: 5,
style: "step"
},
data: [1, 2, 3]
}]
});
</script>