line mark question about group

Community Help
1

my data structure like this:
[ {2024-01-01,2024,10796},
{2024-01-02,2024,11403},
…
{2024-12-31,2024,13072},
{2025-01-01,2025,13137},
{2025-01-02,2025,15366},
…
{2025-06-27,2025,11383},
{2025-06-28,2025,10644}]

my code is:
${resize((width)=>
Plot.plot({
width,
marginRight:40,
marks:[
Plot.ruleY([0]),
Plot.lineY(data, {x: “date”,
y: “cost”,stroke:“year”})
],
x:{type:“time”,
tickformat:“%b”,
ticks:“month”,
grid:true
},
y:{insetTop:40,label:“单位：元”}
}))}

image
image695×771 99 KB

Why does this happen? How should I modify my code?

I am a beginner, thank you very much.

2

Your data structure seems a bit suspect. I would expect it to be something like:

[
  {date: "2024-01-01", year: 2024, cost: 10796},
  {date: "2024-01-02", year: 2024, cost: 11403},
  ...
]

which should work with that Plot code.

Alternatively you can structure your data like this:

[
   ["2024-01-01", 2024, 10796],
   ["2024-01-02", 2024, 10000],
   ...
]

and access the data fields with access functions like this:

Plot.lineY(data, {x: d=>d[0], y: d=>d[2],stroke: d=>d[1]})
3

It was my mistake.Because my data is read from a CSV file, its actual structure is as follows:

[ {date: “2024-01-01”, year: 2024, cost: 10796}, {date: “2024-01-02”, year: 2024, cost: 11403}, … ]

However, the result I want is Figure 2, but the actual output from the code is Figure 1. Could you please help me make it display like Figure 2?