multi dataset render line series bug
- Dominant language
- TypeScript
- Stars
- 67.3k
- Forks
- 19.8k
- Avg merge
- 11d 14h
- Merged PRs (30d)
- 8
Description
### Version
5.1.2
### Steps to reproduce
1. multiple datasets, one dataset has null value on it's first datapoint.
2. xAxis type set to 'category'
```javascript
option = {
"tooltip": { "trigger": "axis" },
"xAxis": { "type": "category" },
"yAxis": { "type": "value" },
"dataset": [
{
"dimensions": ["time", "IN", "OUT"],
"source": [
["2021-08-24T05:04:00Z", null, null],
["2021-08-24T05:05:00Z", 25557.8585, 42295.94875],
["2021-08-24T05:06:00Z", 26529.061500000003, 27959.30075],
["2021-08-24T05:07:00Z", 26442.935, 15044.221000000001],
["2021-08-24T05:08:00Z", 25808.200249999998, 14797.9265],
["2021-08-24T05:09:00Z", 24926.94025, 36655.6425],
["2021-08-24T05:10:00Z", 24289.542, 63481.05500000001],
["2021-08-24T05:11:00Z", 26898.6045, 32675.925],
["2021-08-24T05:12:00Z", 26527.185250000002, 15077.23475],
["2021-08-24T05:13:00Z", 25744.94675, 14864.382249999999],
["2021-08-24T05:14:00Z", 25193.262333333332, 14608.087],
["2021-08-24T05:15:00Z", 24820.80025, 42864.026249999995],
["2021-08-24T05:16:00Z", 25146.29525, 21076.957749999998],
["2021-08-24T05:17:00Z", 25005.54675, 14490.284249999999],
["2021-08-24T05:18:00Z", 25071.7565, 14490.57375],
["2021-08-24T05:19:00Z", 24427.50625, 41984.9355],
["2021-08-24T05:20:00Z", 23729.506999999998, 60567.432],
["2021-08-24T05:21:00Z", 25223.235, 29637.791999999998],
["2021-08-24T05:22:00Z", 24792.1, 14282.797250000001],
["2021-08-24T05:23:00Z", 24533.36525, 14319.3435],
["2021-08-24T05:24:00Z", 24495.62075, 14196.408500000001],
["2021-08-24T05:25:00Z", 23870.25475, 44089.1765],
["2021-08-24T05:26:00Z", 24630.16375, 16366.382249999999],
["2021-08-24T05:27:00Z", 24388.373, 14218.3335],
["2021-08-24T05:28:00Z", 25147.289, 14520.3385],
["2021-08-24T05:29:00Z", 25123.4625, 14506.615],
["2021-08-24T05:30:00Z", 25837.9415, 45363.348000000005],
["2021-08-24T05:31:00Z", 26354.3375, 50252.17450000001],
["2021-08-24T05:32:00Z", 27914.812250000003, 33720.994999999995],
["2021-08-24T05:33:00Z", 27877.28925, 16954.4435],
["2021-08-24T05:34:00Z", 27277.665333333334, 17351.160666666667]
]
},
{
"dimensions": ["time", "IN", "OUT"],
"source": [
["2021-08-24T05:04:00Z", 27518.162, 16452.748],
["2021-08-24T05:05:00Z", 25979.75425, 43106.11975],
["2021-08-24T05:06:00Z", 26665.370000000003, 29175.97475],
["2021-08-24T05:07:00Z", 26644.34975, 15997.3635],
["2021-08-24T05:08:00Z", 26104.9375, 15689.89025],
["2021-08-24T05:09:00Z", 25330.236749999996, 39925.95025],
["2021-08-24T05:10:00Z", 24264.00425, 61915.24675],
["2021-08-24T05:11:00Z", 26828.632749999997, 34729.508],
["2021-08-24T05:12:00Z", 26673.35275, 16058.94975],
["2021-08-24T05:13:00Z", 25779.692750000002, 15466.92325],
["2021-08-24T05:14:00Z", 24997.98175, 15082.0015],
["2021-08-24T05:15:00Z", 24783.283, 43216.87225],
["2021-08-24T05:16:00Z", 25155.3295, 23744.5925],
["2021-08-24T05:17:00Z", 25076.751500000002, 15237.652],
["2021-08-24T05:18:00Z", 25104.77075, 15190.83025],
["2021-08-24T05:19:00Z", 24137.982, 41627.73825],
["2021-08-24T05:20:00Z", 24144.43925, 60619.045999999995],
["2021-08-24T05:21:00Z", 25247.81575, 29033.1525],
["2021-08-24T05:22:00Z", 25193.64725, 15171.083499999999],
["2021-08-24T05:23:00Z", 25124.8475, 15063.4315],
["2021-08-24T05:24:00Z", 24759.575750000004, 14919.28875],
["2021-08-24T05:25:00Z", 24006.89725, 46510.463],
["2021-08-24T05:26:00Z", 24709.84225, 17752.4765],
["2021-08-24T05:27:00Z", 24450.4805, 14826.1185],
["2021-08-24T05:28:00Z", 24836.6025, 14904.04575],
["2021-08-24T05:29:00Z", 24954.8775, 15127.2],
["2021-08-24T05:30:00Z", 25502.4375, 47163.848],
["2021-08-24T05:31:00Z", 25982.8915, 50109.585],
["2021-08-24T05:32:00Z", 27837.845, 35179.441],
["2021-08-24T05:33:00Z", 28008.90133333333, 17928.766333333333],
["2021-08-24T05:34:00Z", 27308.515333333333, 16269.045666666667]
]
}
],
"series": [
{
"type": "line",
"name": "IN {device: deviceA, host: hostA}",
"encode": { "x": "time", "y": "IN" },
"datasetIndex": 0,
"smooth": true,
},
{
"type": "line",
"name": "OUT {device: deviceA, host: hostA}",
"encode": { "x": "time", "y": "OUT" },
"datasetIndex": 0,
"smooth": true,
},
{
"type": "line",
"name": "IN {device: deviceB, host: hostB}",
"encode": { "x": "time", "y": "IN" },
"datasetIndex": 1,
"smooth": true,
},
{
"type": "line",
"name": "OUT {device: deviceB, host: hostB}",
"encode": { "x": "time", "y": "OUT" },
"datasetIndex": 1,
"smooth": true,
"showSymbol": false
}
]
}
```
### What is expected?
just ignore null value.
### What is actually happening?
there is a addition straight line cross the chart.
---
Chart will render correct if set xAxis type to 'time'. But time axis labels will overlap when reduce page width. category axis will auto adjust label interval. That why i use category axis here.
(用time轴是可以正常显示的, 但是time轴的label在缩小页面的时候label不会自动调整,
所以我想用category偷个懒)
Contributor guide
Assessment
This issue has not been assessed yet.