简体   繁体   中英

CanvasJS Chart Data not showing

Got a question for you. I'm working with CanvasJS charts, and the chart is not showing data when rendering.

First i'm initialising the chart using this:

integrity.initChart = function() {
    var chart = new CanvasJS.Chart("integrityChart", {
        animationEnabled: true,
        animationDuration: 2000,
        title: {
            text: integrity.stockCode + " Integrity"
        },
        axisX: {
            title: "Date"
        },
        axisY: {
            title: "Value"
        },
        toolTip: {
            shared: true
        },
        legend: {
            cursor: "pointer",
            verticalAlign: "top",
            horizontalAlign: "center",
            dockInsidePlotArea: true,
            itemclick: toogleDataSeries
        },
        data: [
        {
            toolTipContent: "{x} - {y} (Stoploss: {stoploss}%)",
            type:"line",
            name: "Integrity minute",
            yValueFormatString: "###.##",
            showInLegend: true,
            markerSize: 0,
            dataPoints: [

            ]
        },
        {
            toolTipContent: "{x} - {y} (Stoploss: {stoploss}%)",
            type: "line",
            name: "Integrity hour",
            showInLegend: true,
            yValueFormatString: "###.##",
            markerSize: 0,
            dataPoints: [

            ]
        },
        {
            toolTipContent: "{x} - {y} (Stoploss: {stoploss}%)",
            type: "line",
            name: "Integrity day",
            showInLegend: true,
            yValueFormatString: "###.##",
            markerSize: 0,
            dataPoints: [

            ]
        }
    ]
    });

    integrity.chartObject = chart;
}

And i can see the chart, very nicely, but then i call the update data method.

integrity.renderChart = function() {
    $.ajax({
      url: integrity.requestBase + '&data=integrity',
      cache: false,
      dataType: "json",
      success:function(result) {
          var lowest = null;
          var highest = null;
          var i = 0;

            for (var key in result) {
                if (result.hasOwnProperty(key)) {
                    i = 0;
                    while (i < result[key].length) {
                        if (lowest == null) {
                            lowest = result[key][i].y;
                            highest = result[key][i].y;
                        }

                        if (lowest > result[key][i].y) {
                            lowest = result[key][i].y;
                        }

                        if (highest < result[key][i].y) {
                            highest = result[key][i].y;
                        }
                        i++;
                    }
                }
            }

          integrity.chartObject.options.axisY.viewportMinimum = lowest-(highest-lowest);
          integrity.chartObject.options.axisY.viewportMaximum = highest+(highest-lowest);
          integrity.chartObject.options.axisY.margin = 0;
          integrity.chartObject.options.data[0].dataPoints = result.minute;
          integrity.chartObject.options.data[1].dataPoints = result.hour;
          integrity.chartObject.options.data[2].dataPoints = result.day;
          integrity.chartObject.render();
      }
  });
}

And still no data is to be found, i did an alert(result.day.length) and it did show me ca 70 entries, so the data is getting set to the dataPoints well, but no joy.

Here's a sample of the data as well.

 { "day": [ { "x": "2018-05-30 12:23:19", "y": 81.29, "stoploss": 10 }, { "x": "2018-05-30 12:30:18", "y": 84.51, "stoploss": 7 }, { "x": "2018-05-30 12:37:11", "y": 85.2, "stoploss": 5 }, { "x": "2018-05-30 12:44:24", "y": 85.41, "stoploss": 3 }, { "x": "2018-05-31 00:27:03", "y": -144.35, "stoploss": 5 }, { "x": "2018-05-31 00:34:51", "y": -194.17, "stoploss": 3 }, { "x": "2018-05-31 09:37:28", "y": 3.8, "stoploss": 10 }, { "x": "2018-05-31 09:45:56", "y": 3.8, "stoploss": 7 }, { "x": "2018-05-31 09:54:41", "y": -140.64, "stoploss": 5 }, { "x": "2018-05-31 10:03:01", "y": -182.18, "stoploss": 3 }, { "x": "2018-05-31 10:48:14", "y": 85.82, "stoploss": 10 }, { "x": "2018-05-31 10:56:57", "y": 90.2, "stoploss": 7 }, { "x": "2018-05-31 11:05:10", "y": 76.49, "stoploss": 5 }, { "x": "2018-05-31 11:13:34", "y": 74.83, "stoploss": 3 }, { "x": "2018-05-31 11:55:51", "y": 138.49, "stoploss": 10 }, { "x": "2018-05-31 12:05:04", "y": 134.73, "stoploss": 7 }, { "x": "2018-05-31 12:14:32", "y": 138.75, "stoploss": 5 }, { "x": "2018-05-31 12:23:51", "y": 137.17, "stoploss": 3 }, { "x": "2018-06-03 16:24:35", "y": 127.25, "stoploss": 10 }, { "x": "2018-06-03 16:28:44", "y": 128.78, "stoploss": 7 }, { "x": "2018-06-03 16:32:42", "y": 132.29, "stoploss": 5 }, { "x": "2018-06-03 16:36:42", "y": 131.9, "stoploss": 3 }, { "x": "2018-06-05 19:52:15", "y": 110.21, "stoploss": 10 }, { "x": "2018-06-05 20:00:58", "y": 46.24, "stoploss": 7 }, { "x": "2018-06-05 20:09:46", "y": 118.59, "stoploss": 5 }, { "x": "2018-06-05 20:18:59", "y": 118.59, "stoploss": 3 }, { "x": "2018-06-06 00:13:35", "y": -66.23, "stoploss": 10 }, { "x": "2018-06-06 00:22:41", "y": -66.23, "stoploss": 7 }, { "x": "2018-06-06 00:31:41", "y": -66.23, "stoploss": 5 }, { "x": "2018-06-06 00:40:45", "y": -161.35, "stoploss": 3 }, { "x": "2018-06-07 00:13:25", "y": -58.91, "stoploss": 10 }, { "x": "2018-06-07 00:23:31", "y": -58.91, "stoploss": 7 }, { "x": "2018-06-07 00:32:33", "y": -58.91, "stoploss": 5 }, { "x": "2018-06-07 00:41:44", "y": -157.95, "stoploss": 3 }, { "x": "2018-06-08 00:13:15", "y": 25.88, "stoploss": 10 }, { "x": "2018-06-08 00:22:37", "y": 25.88, "stoploss": 7 }, { "x": "2018-06-08 00:31:52", "y": 25.88, "stoploss": 5 }, { "x": "2018-06-08 00:40:49", "y": -77.03, "stoploss": 3 }, { "x": "2018-06-12 11:54:21", "y": 105.89, "stoploss": 10 }, { "x": "2018-06-12 12:05:49", "y": 147.62, "stoploss": 7 }, { "x": "2018-06-12 12:16:58", "y": 128.44, "stoploss": 5 }, { "x": "2018-06-12 12:28:06", "y": 154, "stoploss": 3 } ], "minute": [ { "x": "2018-05-30 12:34:49", "y": 35.63, "stoploss": 4 }, { "x": "2018-05-30 12:53:40", "y": 46.9, "stoploss": 3 }, { "x": "2018-05-30 13:11:51", "y": 19.02, "stoploss": 2 }, { "x": "2018-05-30 13:30:26", "y": 37.48, "stoploss": 1 }, { "x": "2018-05-30 13:47:58", "y": 45.86, "stoploss": 0.75 }, { "x": "2018-05-30 14:06:07", "y": 31.35, "stoploss": 0.5 }, { "x": "2018-05-31 00:19:51", "y": 7.28, "stoploss": 4 }, { "x": "2018-05-31 00:33:33", "y": 12.43, "stoploss": 3 }, { "x": "2018-05-31 00:45:28", "y": 11.59, "stoploss": 2 }, { "x": "2018-05-31 00:56:05", "y": 2.81, "stoploss": 1 }, { "x": "2018-05-31 01:05:56", "y": 10.61, "stoploss": 0.75 }, { "x": "2018-05-31 01:15:07", "y": 3.71, "stoploss": 0.5 }, { "x": "2018-05-31 09:48:04", "y": 16.35, "stoploss": 4 }, { "x": "2018-05-31 10:09:00", "y": 31.83, "stoploss": 3 }, { "x": "2018-05-31 10:59:25", "y": 45.54, "stoploss": 4 }, { "x": "2018-05-31 12:16:57", "y": 55.82, "stoploss": 4 }, { "x": "2018-06-01 00:13:12", "y": 6.67, "stoploss": 4 }, { "x": "2018-06-01 00:21:56", "y": 5.64, "stoploss": 3 }, { "x": "2018-06-01 00:30:07", "y": 12.99, "stoploss": 2 }, { "x": "2018-06-01 00:37:36", "y": 10.41, "stoploss": 1 }, { "x": "2018-06-01 00:44:41", "y": 3.77, "stoploss": 0.75 }, { "x": "2018-06-01 00:51:39", "y": 0.43, "stoploss": 0.5 }, { "x": "2018-06-02 00:13:14", "y": 7.28, "stoploss": 4 }, { "x": "2018-06-02 00:21:54", "y": 6.9, "stoploss": 3 }, { "x": "2018-06-02 00:30:04", "y": 9.48, "stoploss": 2 }, { "x": "2018-06-02 00:37:36", "y": 7.03, "stoploss": 1 }, { "x": "2018-06-02 00:44:34", "y": 12.76, "stoploss": 0.75 }, { "x": "2018-06-02 00:51:24", "y": 5.47, "stoploss": 0.5 }, { "x": "2018-06-05 00:19:41", "y": 1.67, "stoploss": 3 }, { "x": "2018-06-05 00:26:59", "y": 0.95, "stoploss": 2 }, { "x": "2018-06-05 00:33:49", "y": 0.73, "stoploss": 1 }, { "x": "2018-06-05 00:46:26", "y": 0.73, "stoploss": 0.5 }, { "x": "2018-06-05 20:19:43", "y": 42.77, "stoploss": 4 }, { "x": "2018-06-05 20:50:24", "y": 33.35, "stoploss": 3 }, { "x": "2018-06-05 21:19:03", "y": 32.95, "stoploss": 2 }, { "x": "2018-06-05 21:46:06", "y": 20.87, "stoploss": 1 }, { "x": "2018-06-05 22:10:59", "y": 11.25, "stoploss": 0.75 }, { "x": "2018-06-05 22:34:21", "y": 14.94, "stoploss": 0.5 }, { "x": "2018-06-06 00:21:35", "y": 5, "stoploss": 4 }, { "x": "2018-06-06 00:37:56", "y": 3.09, "stoploss": 3 }, { "x": "2018-06-06 00:52:35", "y": 7.56, "stoploss": 2 }, { "x": "2018-06-06 01:06:55", "y": 7.56, "stoploss": 1 }, { "x": "2018-06-06 01:20:28", "y": 1.41, "stoploss": 0.75 }, { "x": "2018-06-06 01:33:35", "y": 1.71, "stoploss": 0.5 }, { "x": "2018-06-07 00:21:33", "y": 10.97, "stoploss": 4 }, { "x": "2018-06-07 00:38:31", "y": 7.47, "stoploss": 3 }, { "x": "2018-06-07 00:54:43", "y": 4.89, "stoploss": 2 }, { "x": "2018-06-08 00:24:25", "y": 18.93, "stoploss": 4 }, { "x": "2018-06-08 00:43:49", "y": 5.91, "stoploss": 3 }, { "x": "2018-06-08 01:02:08", "y": 3.74, "stoploss": 2 }, { "x": "2018-06-08 01:18:32", "y": 6.93, "stoploss": 1 }, { "x": "2018-06-08 01:33:46", "y": 9.44, "stoploss": 0.75 }, { "x": "2018-06-09 00:24:03", "y": 2.2, "stoploss": 4 }, { "x": "2018-06-09 00:42:15", "y": 0.32, "stoploss": 3 }, { "x": "2018-06-09 00:58:49", "y": 3.26, "stoploss": 2 }, { "x": "2018-06-09 01:30:28", "y": 0.7, "stoploss": 0.75 }, { "x": "2018-06-12 00:21:39", "y": 4.45, "stoploss": 4 }, { "x": "2018-06-12 00:37:55", "y": 2.97, "stoploss": 3 }, { "x": "2018-06-12 00:54:02", "y": 9.16, "stoploss": 2 }, { "x": "2018-06-12 01:09:04", "y": 0.25, "stoploss": 1 }, { "x": "2018-06-12 01:23:56", "y": 1.43, "stoploss": 0.75 }, { "x": "2018-06-12 01:36:53", "y": 4.38, "stoploss": 0.5 }, { "x": "2018-06-12 12:23:45", "y": 39.36, "stoploss": 4 }, { "x": "2018-06-12 13:00:28", "y": 33.25, "stoploss": 3 }, { "x": "2018-06-12 13:37:14", "y": 46.48, "stoploss": 2 }, { "x": "2018-06-13 00:20:59", "y": 12.01, "stoploss": 4 }, { "x": "2018-06-13 00:40:09", "y": 0.75, "stoploss": 3 }, { "x": "2018-06-13 00:57:54", "y": 0.55, "stoploss": 2 }, { "x": "2018-06-13 01:12:55", "y": 0.5, "stoploss": 1 }, { "x": "2018-06-13 01:27:47", "y": 3, "stoploss": 0.75 } ], "hour": [ { "x": "2018-05-30 12:35:12", "y": -71.36, "stoploss": 7 }, { "x": "2018-05-30 12:54:16", "y": -96.86, "stoploss": 5 }, { "x": "2018-05-30 13:13:00", "y": -110.86, "stoploss": 3 }, { "x": "2018-05-30 13:33:11", "y": -79.86, "stoploss": 2 }, { "x": "2018-05-30 13:52:32", "y": -134.34, "stoploss": 1 }, { "x": "2018-05-31 00:37:12", "y": 70.52, "stoploss": 7 }, { "x": "2018-05-31 01:11:47", "y": 80.79, "stoploss": 5 }, { "x": "2018-05-31 01:45:49", "y": 78.55, "stoploss": 3 }, { "x": "2018-05-31 02:19:58", "y": 79.35, "stoploss": 2 }, { "x": "2018-05-31 02:54:19", "y": 120.08, "stoploss": 1 }, { "x": "2018-05-31 10:03:50", "y": 2.6, "stoploss": 7 }, { "x": "2018-05-31 11:10:52", "y": 130.15, "stoploss": 7 }, { "x": "2018-05-31 12:20:51", "y": 113.96, "stoploss": 7 }, { "x": "2018-06-01 00:33:30", "y": 232.75, "stoploss": 7 }, { "x": "2018-06-01 01:04:04", "y": 204.37, "stoploss": 5 }, { "x": "2018-06-01 01:34:53", "y": 233.88, "stoploss": 3 }, { "x": "2018-06-01 02:06:41", "y": 225.59, "stoploss": 2 }, { "x": "2018-06-01 02:37:02", "y": 209.71, "stoploss": 1 }, { "x": "2018-06-02 00:33:35", "y": 214.83, "stoploss": 7 }, { "x": "2018-06-02 01:03:41", "y": 200.75, "stoploss": 5 }, { "x": "2018-06-02 01:33:20", "y": 214.83, "stoploss": 3 }, { "x": "2018-06-02 02:04:22", "y": 200.75, "stoploss": 2 }, { "x": "2018-06-02 02:35:17", "y": 199.88, "stoploss": 1 }, { "x": "2018-06-03 00:33:55", "y": 214.83, "stoploss": 7 }, { "x": "2018-06-03 01:04:20", "y": 200.75, "stoploss": 5 }, { "x": "2018-06-03 01:35:12", "y": 208.15, "stoploss": 3 }, { "x": "2018-06-03 02:06:41", "y": 214.16, "stoploss": 2 }, { "x": "2018-06-03 02:37:48", "y": 187.27, "stoploss": 1 }, { "x": "2018-06-04 00:33:52", "y": 214.83, "stoploss": 7 }, { "x": "2018-06-04 01:04:27", "y": 200.75, "stoploss": 5 }, { "x": "2018-06-04 01:35:14", "y": 208.15, "stoploss": 3 }, { "x": "2018-06-04 02:05:50", "y": 214.16, "stoploss": 2 }, { "x": "2018-06-04 02:36:16", "y": 194.82, "stoploss": 1 }, { "x": "2018-06-05 00:34:25", "y": 105.78, "stoploss": 7 }, { "x": "2018-06-05 01:05:44", "y": 144.34, "stoploss": 5 }, { "x": "2018-06-05 01:37:42", "y": 111.79, "stoploss": 3 }, { "x": "2018-06-05 02:09:23", "y": 132.81, "stoploss": 2 }, { "x": "2018-06-05 02:41:08", "y": 92.17, "stoploss": 1 }, { "x": "2018-06-05 20:24:13", "y": 207.02, "stoploss": 7 }, { "x": "2018-06-05 21:00:57", "y": 189.36, "stoploss": 5 }, { "x": "2018-06-05 21:36:34", "y": 202.61, "stoploss": 3 }, { "x": "2018-06-05 22:12:57", "y": 174.41, "stoploss": 2 }, { "x": "2018-06-05 22:49:35", "y": 171.98, "stoploss": 1 }, { "x": "2018-06-06 00:39:39", "y": 178.5, "stoploss": 7 }, { "x": "2018-06-06 01:15:28", "y": 148.71, "stoploss": 5 }, { "x": "2018-06-06 01:51:41", "y": 184.62, "stoploss": 3 }, { "x": "2018-06-06 02:27:17", "y": 160.87, "stoploss": 2 }, { "x": "2018-06-06 03:02:59", "y": 187.7, "stoploss": 1 }, { "x": "2018-06-07 00:40:59", "y": 192.14, "stoploss": 7 }, { "x": "2018-06-07 01:17:25", "y": 194.25, "stoploss": 5 }, { "x": "2018-06-07 01:53:54", "y": 194.11, "stoploss": 3 }, { "x": "2018-06-07 02:30:58", "y": 165.61, "stoploss": 2 }, { "x": "2018-06-07 03:07:24", "y": 195.16, "stoploss": 1 }, { "x": "2018-06-08 00:41:27", "y": 89.22, "stoploss": 7 }, { "x": "2018-06-08 01:18:40", "y": 37.08, "stoploss": 5 }, { "x": "2018-06-08 01:56:18", "y": 47.82, "stoploss": 3 }, { "x": "2018-06-08 02:33:26", "y": 25.93, "stoploss": 2 }, { "x": "2018-06-08 03:10:03", "y": 16.87, "stoploss": 1 }, { "x": "2018-06-09 00:32:37", "y": 108.62, "stoploss": 7 }, { "x": "2018-06-09 01:00:59", "y": 84.9, "stoploss": 5 }, { "x": "2018-06-09 01:28:42", "y": 54.64, "stoploss": 3 }, { "x": "2018-06-09 01:56:52", "y": 95, "stoploss": 2 }, { "x": "2018-06-09 02:25:51", "y": 84.19, "stoploss": 1 }, { "x": "2018-06-12 00:31:31", "y": 90.56, "stoploss": 7 }, { "x": "2018-06-12 00:58:57", "y": 66.41, "stoploss": 5 }, { "x": "2018-06-12 01:26:19", "y": 47.07, "stoploss": 3 }, { "x": "2018-06-12 01:52:17", "y": 79.47, "stoploss": 2 }, { "x": "2018-06-12 02:18:44", "y": 21.59, "stoploss": 1 }, { "x": "2018-06-12 12:12:09", "y": 40.95, "stoploss": 7 }, { "x": "2018-06-12 12:39:36", "y": 62.88, "stoploss": 5 }, { "x": "2018-06-12 13:07:54", "y": 35.63, "stoploss": 3 }, { "x": "2018-06-12 13:36:09", "y": 113.16, "stoploss": 2 }, { "x": "2018-06-12 14:04:27", "y": 49.53, "stoploss": 1 }, { "x": "2018-06-13 00:29:40", "y": 106.13, "stoploss": 7 }, { "x": "2018-06-13 00:55:23", "y": 63.13, "stoploss": 5 }, { "x": "2018-06-13 01:21:11", "y": 32.94, "stoploss": 3 }, { "x": "2018-06-13 01:46:40", "y": 84.03, "stoploss": 2 }, { "x": "2018-06-13 02:13:10", "y": 24.88, "stoploss": 1 } ] } 

X轴将dateobject作为输入,而不仅仅是date作为字符串。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM