Kendo StockChart

update with error conditions

by pirahawk

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2013.3.1119/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.dataviz.min.css">
<div id="chart"></div>

JavaScript

var dataForSource = [{

    date: new Date("December 16, 2013 02:06:00 AM"),
    Count: 0
}, {
    date: new Date("December 16, 2013 02:07:00 AM"),
    Count: 1
},

{
    date: new Date("December 16, 2013 02:09:00 AM"),
    Count: 0
}, {
    date: new Date("December 16, 2013 02:09:15 AM"),
    Count: -1
},

{
    date: new Date("December 16, 2013 02:09:45 AM"),
    Count: 0
},


{
    date: new Date("December 16, 2013 02:10:00 AM"),
    Count: -1
}, {
    date: new Date("December 16, 2013 02:15:00 AM"),
    Count: 0
}

                     
//Comment these out to see issue
/*                   
, {
   date: new Date("December 16, 2013 04:10:01 PM"),
 Count: -1
}
                     
, {
    date: new Date("December 16, 2013 11:55:00 PM"),
    Count: 0
}
*/  


];


var staticDataSource = new kendo.data.DataSource({
    type: "line",
    data: dataForSource
});

function createChart() {
    $("#chart").kendoStockChart({
        dataSource: staticDataSource,

        dateField: "date",

        series: [{
            type: "line",
            style: 'step',
            //missingValues: "interpolate",
            field: "Count",
            categoryField: "date"
        }],

        xAxis: {
            baseUnit: "seconds"
        },


        navigator: {
            series: {
                type: "line",
                style: 'step',
                field: "Count"
            },

            xAxis: {
                baseUnit: "hours"
            },
        }

    });
};

$(document).ready(createChart);