valueAxis.plotBandsArray
The plot bands of the value axis.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
dataSource: {
data: [
{ date: "2012/01/01", open: 10, high: 15, low: 8, close: 12, volume: 1000 },
{ date: "2012/01/02", open: 12, high: 18, low: 10, close: 15, volume: 1200 }
]
},
dateField: "date",
valueAxis: {
plotBands: [{
from: 11,
to: 14,
color: "lightblue",
opacity: 0.5
}]
},
series: [{
type: "candlestick",
openField: "open",
highField: "high",
lowField: "low",
closeField: "close"
}]
});
</script>
valueAxis.plotBands.fromNumber
The start position of the plot band in axis units.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
dataSource: {
data: [
{ date: "2012/01/01", open: 10, high: 15, low: 8, close: 12, volume: 1000 },
{ date: "2012/01/02", open: 12, high: 18, low: 10, close: 15, volume: 1200 }
]
},
dateField: "date",
valueAxis: {
plotBands: [{
from: 10
}]
},
series: [{
type: "candlestick",
openField: "open",
highField: "high",
lowField: "low",
closeField: "close"
}]
});
</script>
valueAxis.plotBands.toNumber
The end position of the plot band in axis units.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
dataSource: {
data: [
{ date: "2012/01/01", open: 10, high: 15, low: 8, close: 12, volume: 1000 },
{ date: "2012/01/02", open: 12, high: 18, low: 10, close: 15, volume: 1200 }
]
},
dateField: "date",
valueAxis: {
plotBands: [{
to: 15
}]
},
series: [{
type: "candlestick",
openField: "open",
highField: "high",
lowField: "low",
closeField: "close"
}]
});
</script>
valueAxis.plotBands.colorString
The color of the plot band.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
dataSource: {
data: [
{ date: "2012/01/01", open: 10, high: 15, low: 8, close: 12, volume: 1000 },
{ date: "2012/01/02", open: 12, high: 18, low: 10, close: 15, volume: 1200 }
]
},
dateField: "date",
valueAxis: {
plotBands: [{
from: 11,
to: 14,
color: "yellow"
}]
},
series: [{
type: "candlestick",
openField: "open",
highField: "high",
lowField: "low",
closeField: "close"
}]
});
</script>
valueAxis.plotBands.opacityNumber
The opacity of the plot band.
Example
<div id="stock-chart"></div>
<script>
$("#stock-chart").kendoStockChart({
dataSource: {
data: [
{ date: "2012/01/01", open: 10, high: 15, low: 8, close: 12, volume: 1000 },
{ date: "2012/01/02", open: 12, high: 18, low: 10, close: 15, volume: 1200 }
]
},
dateField: "date",
valueAxis: {
plotBands: [{
from: 11,
to: 14,
color: "red",
opacity: 0.3
}]
},
series: [{
type: "candlestick",
openField: "open",
highField: "high",
lowField: "low",
closeField: "close"
}]
});
</script>
In this article