Reply To: Area Spline problem with DateTime values

[Jacob]

In there is one value for 9 and not 11. I think you may have skipped over that. I will try fiddle but here is the code to make the graph:

function GetHistoryOverview(url) {
    $(".panel-systemhistory").block();
    $.getJSON(url, function (data) {
        var users = { type: "splineArea", lineThickness: 2, name: "Users", showInLegend: true, xValueType: "dateTime", dataPoints: [] };
        var mailboxes = { type: "splineArea", lineThickness: 2, name: "Mailboxes", showInLegend: true, xValueType: "dateTime", dataPoints: [] };
        var citrix = { type: "splineArea", lineThickness: 2, name: "Citrix", showInLegend: true, xValueType: "dateTime", dataPoints: [] };

        var chart = new CanvasJS.Chart("historyOverview",
            {
                animationEnabled: true,
                zoomEnabled: true,
                title: { text: "" },
                toolTip: { shared: true },
                axisX: { labelAngle: -50 },
                legend: {
                    cursor: "pointer",
                    itemclick: function (e) {
                        if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                            e.dataSeries.visible = false;
                        }
                        else {
                            e.dataSeries.visible = true;
                        }
                        chart.render();
                    }

                },
                data: []
            }
        );

        $.each(data, function (i, val) {
            if (val.retrieved != null) {
                var actualTime = moment(val.retrieved).format();
                var xValue = new Date(actualTime);

                if (val.hasOwnProperty("userCount"))
                    users.dataPoints.push({ x: xValue, y: val.userCount });

                if (val.hasOwnProperty("mailboxCount"))
                    mailboxes.dataPoints.push({ x: xValue, y: val.mailboxCount });

                if (val.hasOwnProperty("citrixCount"))
                    citrix.dataPoints.push({ x: xValue, y: val.citrixCount });
            }
        });

        if (users.dataPoints.length > 0)
            chart.options.data.push(users);

        if (mailboxes.dataPoints.length > 0)
            chart.options.data.push(mailboxes);

        if (citrix.dataPoints.length > 0)
            chart.options.data.push(citrix);

        chart.render();
    }).fail(function (data) {
        ShowError(data);
    }).always(function() {
        $(".panel-systemhistory").unblock();
    });
}