series.lineString|Object
The chart line configuration options.
The
lineoption 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.colorString
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.opacityNumber(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.widthNumber(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.styleString(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
styleoption is supported when series.type is set to "area", "rangeArea", "polarArea" or "radarArea".
The
stepvalue 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>In this article