ECharts Punch Bar Scatter from dataset

user_107671 0
Viewed 59

I'm trying to generate a Punch Card, but unlike the provided example, I'd like to use the dataset option.

Desired result: 'week' (w1 .. w5) on xAxis and stacked (a1 .. a4) on yAxis, with symbolSize relative to respective value.

punch bar

I'm currently using these options. What am I missing?

{
"tooltip": {},
"dataset": {
    "source": [
    {"week": "w1", "a1": 1, "a2": 1, "a3": 1, "a4": 0},
    {"week": "w2", "a1": 3, "a2": 5, "a3": 2, "a4": 1},
    {"week": "w3", "a1": 2, "a2": 3, "a3": 1, "a4": 4},
    {"week": "w4", "a1": 6, "a2": 1, "a3": 2, "a4": 0},
    {"week": "w5", "a1": 6, "a2": 2, "a3": 3, "a4": 0}
    ],
    "dimensions": ["week","a1","a2","a3","a4"]
},
"xAxis": {
    "type": "category"
},
"yAxis": {
    "type": "category"
},
"series": [
    {
    "type": "scatter",
    symbolSize: function (val) {
        console.log(val)
        // how to use val / filter current category? (a1..a4?)
        return 10
    },
    }
]
};

See: codepen

apache-echarts echarts
1 Answers

As for the size, you can see that val is simply an object and you can do something like this:

symbolSize: function (val) {
     return val.a1 * 10
  },
user_154520720
Related