Highcharts分散外部数据

Question

我创建的文档与highcharts散点图

   Highcharts.chart('container', { 
       chart: { 
        type: 'scatter', 
        zoomType: 'xy' 
       }, 
       title: { 
        text: '' 
       }, 
       subtitle: { 
        text: '' 
       }, 
       xAxis: { 
        title: { 
         enabled: true, 
         text: 'Date of entry' 
        }, 
        startOnTick: true, 
        endOnTick: true, 
        showLastLabel: true 
       }, 
       yAxis: { 
        title: { 
         text: 'Values' 
        } 
       }, 
       legend: { 
        layout: 'vertical', 
        align: 'left', 
        verticalAlign: 'top', 
        x: 100, 
        y: 70, 
        floating: true, 
        backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF', 
        borderWidth: 1 
       }, 
       plotOptions: { 
        scatter: { 
         marker: { 
          radius: 5, 
          states: { 
           hover: { 
            enabled: true, 
            lineColor: 'rgb(100,100,100)' 
           } 
          } 
         }, 
         states: { 
          hover: { 
           marker: { 
            enabled: false 
           } 
          } 
         }, 
         tooltip: { 
          headerFormat: '<b>{series.name}</b><br>', 
          pointFormat: 'Dana {point.x} = {point.y}' 
         } 
        } 
       }, 
       series: [{ 
        name: 'Values', 
        color: 'rgba(223, 83, 83, .5)', 
        data: [[167.6, 64.5], [167.6, 72.3], [167.6, 61.4]] 
       }] 
      }); 

和工作原理。此代码来自文档页面。我得到了像这个页面上的正常分散数据Highcharts scatter jsfiddle 现在，我创建了另一个PHP文件，该文件生成了我实际需要的数据。它是在文件highcharts.php和结果是这样的

[07.03.2017,21000],[07.03.2017,25000],[07.03.2017,33000],[07.03.2017,27000],[07.03.2017,30000],[01.01.2017,700],[11.05.2017,0],[11.05.2017,0],[11.05.2017,0],[11.05.2017,0],

如何将数据连接到这个highcharts.php文件？我找到了一些例子，但我无法实现它的工作。所以开始我需要这个，一行数据显示在散点图上。我失去了几天，只是不明白我做错了什么。

Answer 1

如果你的PHP文件返回上面提到的数组，你需要对它进行一点解析，以便将它用作散布系列中的数据数组。首先，日期应该是字符串。其次，您需要使用new Date()来创建Date实例并使用getTime()来返回时间戳。另外，将xAxis类型更改为datetime。

API参考：
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getTime

例子：
http://jsfiddle.net/0025rsmt/