ChartJS散点图X轴标签没有正确显示

我对javascript世界相当陌生，所以如果有明显的解决方案，请耐心等待，但我努力在日期（X点）上绘制日期chartjs图的X轴。我有一些奇怪的时刻，你可以检查jsfiddle。我究竟做错了什么？ChartJS散点图X轴标签没有正确显示

var ctx = document.getElementById("myChart"); 
var data = { 
    datasets: [{ 
     label: " Property", 
     lineTension: 0.1, 
     data: [{ 
      x: 2017 - 04 - 11, 
      y: 2000000.00 
     }, 
     { 
      x: 2017 - 04 - 12, 
      y: 1000000.00 
     }, 
     { 
      x: 2017 - 04 - 13, 
      y: 3000000.00 
     }, 
     ] 
    }, 
    { 
     label: " Property", 
     lineTension: 0.1, 
     data: [{ 
      x: 2017 - 04 - 12, 
      y: 472943.00 
     }, 
     { 
      x: 2017 - 04 - 13, 
      y: 1000000.00 
     }, 
     ] 
    }, 
    ] 
}; 
var myLineChart = new Chart(ctx, { 
    type: 'line', 
    data: data, 
    options: { 
    scales: { 
     xAxes: [{ 
     id: 'ScartCharxAxes', 
     type: 'time', 
     unit: 'day', 
     time: { 
      displayFormats: { 
      day: 'D MMM YYYY' 
      }, 
     } 
     }] 
    } 
    } 
});

我的代码可以在http://jsfiddle.net/py1bpf02/3/

来源

2017-04-13 Borko Kovacev

在你的数据集，日期应弦。你做的是数学，而不是日期。 2017-04-11 = 2002。

var ctx = document.getElementById("myChart"); 
 
var data = { 
 
    datasets: [ 
 

 
    { 
 
     label: " Property", 
 
     lineTension: 0.1, 
 
     data: [{ 
 
      x: "2017-04-11", 
 
      y: 2000000.00 
 
     }, 
 

 
     { 
 
      x: "2017-04-12", 
 
      y: 1000000.00 
 
     }, 
 

 
     { 
 
      x: "2017-04-13", 
 
      y: 3000000.00 
 
     }, 
 
     ] 
 
    }, 
 

 
    { 
 
     label: " Property", 
 
     lineTension: 0.1, 
 
     data: [{ 
 
      x: "2017-04-12", 
 
      y: 472943.00 
 
     }, 
 

 
     { 
 
      x: "2017-04-13", 
 
      y: 1000000.00 
 
     }, 
 
     ] 
 
    }, 
 

 

 
    ] 
 
}; 
 

 
var myLineChart = new Chart(ctx, { 
 
    type: 'line', 
 
    data: data, 
 
    options: { 
 
    scales: { 
 
     xAxes: [{ 
 
     id: 'ScartCharxAxes', 
 
     type: 'time', 
 
     time: { 
 
      unit: 'day', 
 
      displayFormats: { 
 
      day: 'D MMM' 
 
      }, 
 
     } 
 
     }] 
 
    } 
 
    } 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.bundle.min.js"></script> 
 
<canvas id="myChart"></canvas>

来源

2017-04-13 10:22:23 Oen44

感谢 - 这解决了这个问题对我来说。我还有一个问题，我如何让图上的点只是x坐标 - 只有一个4月11日，4月12日等？ –

我知道你想做什么，但我不认为如果这是可能的。您不能在一个点存储多个数据。如果它们不相等，那么它们必须处于不同的'y'，如果它们不需要创建具有相同数据的多个点。 – Oen44

对不起，我没有正确表达自己。 “我的意思是，这个单位可能只有一天，没有PM和AM，所以我只有X轴上的标签和我的坐标一样多，而且没有早上6点，上午12点，下午等？ –

ChartJS散点图X轴标签没有正确显示

回答

相关问题