ChartJS不加载数据,但输入硬编码的相同数据工作

yhqotfr8  于 2022-11-06  发布在  Chart.js
关注(0)|答案(1)|浏览(178)

因此我得到了这个chartJS(react)元素,当我使用硬编码数据时,它工作得非常好:

  1. <Line data={{
  2. labels: ['2022-07-04', '2022-07-03', '2022-07-02', '2022-06-27'],
  3. datasets: [
  4. {
  5. label: 'My First dataset',
  6. fill: false,
  7. lineTension: 0.1,
  8. backgroundColor: 'rgba(75,192,192,0.4)',
  9. borderColor: 'rgba(75,192,192,1)',
  10. borderCapStyle: 'butt',
  11. borderDash: [],
  12. borderDashOffset: 0.0,
  13. borderJoinStyle: 'miter',
  14. pointBorderColor: 'rgba(75,192,192,1)',
  15. pointBackgroundColor: '#fff',
  16. pointBorderWidth: 1,
  17. pointHoverRadius: 5,
  18. pointHoverBackgroundColor: 'rgba(75,192,192,1)',
  19. pointHoverBorderColor: 'rgba(220,220,220,1)',
  20. pointHoverBorderWidth: 2,
  21. pointRadius: 1,
  22. pointHitRadius: 10,
  23. data: [3.1, 3.1, 3.1, 2.74]
  24. },
  25. ]
  26. }}
  27. />

然而,当我将数据和标签更改为数组时,我将完全相同的数据推送到数组中,当我控制台记录它时,它返回完全相同的数组,它不会填满图表。

  1. <Line data={{
  2. labels: dateArray,
  3. datasets: [
  4. {
  5. label: 'My First dataset',
  6. fill: false,
  7. lineTension: 0.1,
  8. backgroundColor: 'rgba(75,192,192,0.4)',
  9. borderColor: 'rgba(75,192,192,1)',
  10. borderCapStyle: 'butt',
  11. borderDash: [],
  12. borderDashOffset: 0.0,
  13. borderJoinStyle: 'miter',
  14. pointBorderColor: 'rgba(75,192,192,1)',
  15. pointBackgroundColor: '#fff',
  16. pointBorderWidth: 1,
  17. pointHoverRadius: 5,
  18. pointHoverBackgroundColor: 'rgba(75,192,192,1)',
  19. pointHoverBorderColor: 'rgba(220,220,220,1)',
  20. pointHoverBorderWidth: 2,
  21. pointRadius: 1,
  22. pointHitRadius: 10,
  23. data: priceArray
  24. },
  25. ]
  26. }}
  27. />

注意,对于硬编码的数据,我控制台记录了我的数组,并将它们复制粘贴到数据对象中。
顺便说一句,我知道价格和日期数组是向后的,不用担心,它都能工作。

pbwdgjma

pbwdgjma1#

把它改成字符串怎么样?
您可以通过Array.join()priceArray数组转换为字符串,如下所示:

  1. data: priceArray.join(', ')

相关问题