navigator.series.missingValuesString
The behavior for handling missing values. The supported values are:
- "gap" - the plot stops before the missing point and continues after it.
- "interpolate" - the value is interpolated from neighboring points.
- "zero" - the value is assumed to be zero.
The default value is "interpolate", except for "area" and stacked series which default to "zero".
The
missingValuesoption is supported when series.type is set to "area" and "line".
Example
<div id="stockChart"></div>
<script>
$(document).ready(function () {
// Sample local stock data
var stockData = [
{ date: new Date(2024, 0, 1), open: 150.25, high: 152.80, low: 149.50, close: 152.30 },
{ date: new Date(2024, 0, 2), open: 152.50, high: 154.20, low: 151.80, close: 153.75 },
{ date: new Date(2024, 0, 3), open: 153.80, high: 155.40, low: 152.90, close: 154.20 },
];
$("#stockChart").kendoStockChart({
series: [{
type: "candlestick",
data: stockData, // Data passed directly to series
openField: "open",
highField: "high",
lowField: "low",
closeField: "close",
dateField: "date", // Specify date field for category axis
name: "Stock Price"
}],
navigator: {
series: {
type: "line", // You can use "area", "candlestick", "ohlc" too
data: stockData, // Navigator needs its own data reference
field: "close", // Use closing price for navigator
dateField: "date",
markers: {
visible: true,
missingValues: "gap"
}
},
select: {
from: new Date(2024, 0, 10), // Initial selection start
to: new Date(2024, 0, 20) // Initial selection end
}
},
categoryAxis: {
baseUnit: "days",
labels: {
format: "MMM dd"
}
},
valueAxis: {
labels: {
format: "${0}"
}
}
});
});
</script>
In this article