因此我得到了这个chartJS(react)元素,当我使用硬编码数据时,它工作得非常好:
<Line data={{
labels: ['2022-07-04', '2022-07-03', '2022-07-02', '2022-06-27'],
datasets: [
{
label: 'My First dataset',
fill: false,
lineTension: 0.1,
backgroundColor: 'rgba(75,192,192,0.4)',
borderColor: 'rgba(75,192,192,1)',
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: 'rgba(75,192,192,1)',
pointBackgroundColor: '#fff',
pointBorderWidth: 1,
pointHoverRadius: 5,
pointHoverBackgroundColor: 'rgba(75,192,192,1)',
pointHoverBorderColor: 'rgba(220,220,220,1)',
pointHoverBorderWidth: 2,
pointRadius: 1,
pointHitRadius: 10,
data: [3.1, 3.1, 3.1, 2.74]
},
]
}}
/>
然而,当我将数据和标签更改为数组时,我将完全相同的数据推送到数组中,当我控制台记录它时,它返回完全相同的数组,它不会填满图表。
<Line data={{
labels: dateArray,
datasets: [
{
label: 'My First dataset',
fill: false,
lineTension: 0.1,
backgroundColor: 'rgba(75,192,192,0.4)',
borderColor: 'rgba(75,192,192,1)',
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: 'rgba(75,192,192,1)',
pointBackgroundColor: '#fff',
pointBorderWidth: 1,
pointHoverRadius: 5,
pointHoverBackgroundColor: 'rgba(75,192,192,1)',
pointHoverBorderColor: 'rgba(220,220,220,1)',
pointHoverBorderWidth: 2,
pointRadius: 1,
pointHitRadius: 10,
data: priceArray
},
]
}}
/>
注意,对于硬编码的数据,我控制台记录了我的数组,并将它们复制粘贴到数据对象中。
顺便说一句,我知道价格和日期数组是向后的,不用担心,它都能工作。
1条答案
按热度按时间pbwdgjma1#
把它改成字符串怎么样?
您可以通过
Array.join()
将priceArray
数组转换为字符串,如下所示: