Error when inserting new Series in a place different to the end of the list 
(for line chart)

Hello!

I'm developing a dynamic chart module and I need to be able to add and remove 
series dinamically.

It throws the following error when I splice a new series in a different index 
than the last one,

```
Uncaught TypeError: Cannot read property 'type' of undefined
    at Object.reset (dataSample.js?3d66:84)
    at Task.seriesTaskReset [as _reset] (Scheduler.js?bee6:451)
    at reset (task.js?815e:212)
    at Task.taskProto.perform (task.js?815e:109)
    at eval (Scheduler.js?bee6:267)
    at HashMap.each (util.js?fe0c:663)
    at eval (Scheduler.js?bee6:259)
    at Array.forEach (<anonymous>)
    at each (util.js?fe0c:298)
    at performStageTasks (Scheduler.js?bee6:228)
    at Scheduler.proto.performDataProcessorTasks (Scheduler.js?bee6:213)
    at ECharts.update (echarts.js?21c7:752)
    at ECharts.echartsProto.setOption (echarts.js?21c7:372)
    at EchartsReactCore._this.renderEchartDom (core.js?6560:107)
    at EchartsReact.componentDidUpdate (core.js?6560:155)
    at commitLifeCycles (react-dom.development.js?cada:14369)
    at commitAllLifeCycles (react-dom.development.js?cada:15462)
    at HTMLUnknownElement.callCallback (react-dom.development.js?cada:100)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?cada:138)
    at invokeGuardedCallback (react-dom.development.js?cada:187)
    at commitRoot (react-dom.development.js?cada:15603)
    at completeRoot (react-dom.development.js?cada:16618)
    at performWorkOnRoot (react-dom.development.js?cada:16563)
    at performWork (react-dom.development.js?cada:16482)
    at performSyncWork (react-dom.development.js?cada:16454)
    at requestWork (react-dom.development.js?cada:16354)
    at scheduleWork$1 (react-dom.development.js?cada:16218)
    at Object.enqueueSetState (react-dom.development.js?cada:11299)
    at Connect.Component.setState (react.development.js?99ee:270)
    at Connect.onStateChange (connectAdvanced.js?4805:205)
    at Object.dispatch (createStore.js?6413:173)
    at dispatch (<anonymous>:1:38223)
    at eval (index.js?6c4c:11)
    at dispatch (applyMiddleware.js?be0b:35)
    at eval (index.js?7905:56)
    at eval (index.js?6c4c:8)
    at dispatch (applyMiddleware.js?be0b:35)
    at _callee$ (index.js?7905:72)
    at tryCatch (runtime.js?4a57:62)
    at Generator.invoke [as _invoke] (runtime.js?4a57:296)
    at Generator.prototype.(:8087/app/data-analysis/anonymous function) [as 
next] (webpack-internal:///378:114:21)
    at step (asyncToGenerator.js?7b11:17)
    at eval (asyncToGenerator.js?7b11:28)
```
This is the option object when there is no error

```
{
  "grid": [
    {
      "height": 180,
      "right": 50,
      "left": 50,
      "top": 40,
      "backgroundColor": "#FFF",
      "show": true
    },
    {
      "height": 180,
      "right": 50,
      "left": 50,
      "top": 270,
      "backgroundColor": "#FFF",
      "show": true
    }
  ],
  "xAxis": [
    {
      "gridIndex": 0,
      "type": "time",
      "position": "bottom",
      "splitLine": {
        "show": false
      }
    },
    {
      "gridIndex": 1,
      "type": "time",
      "position": "bottom",
      "splitLine": {
        "show": false
      }
    }
  ],
  "yAxis": [
    {
      "name": "Raw Test Device",
      "type": "value",
      "scale": true,
      "gridIndex": 0,
      "splitLine": {
        "show": false
      },
      "position": "left",
      "nameLocation": "center",
      "nameTextStyle": {
        "fontStyle": "Open Sans",
        "color": "#777",
        "fontSize": 16
      },
      "nameGap": 30,
      "offset": 0
    },
    {
      "name": "Raw Test Device",
      "type": "value",
      "scale": true,
      "gridIndex": 1,
      "splitLine": {
        "show": false
      },
      "position": "left",
      "nameLocation": "center",
      "nameTextStyle": {
        "fontStyle": "Open Sans",
        "color": "#777",
        "fontSize": 16
      },
      "nameGap": 30,
      "offset": 0
    }
  ],
  "series": [
    {
      "name": "Raw Test Device",
      "type": "line",
      "showSymbol": false,
      "lineStyle": {
        "width": 1,
        "color": "#2FBD68"
      },
      "itemStyle": {
        "color": "#2FBD68"
      },
      "data": [
        [
          1535672110000,
          84
        ],
        [
          1535672120000,
          73
        ]
      ],
      "xAxisIndex": 0,
      "yAxisIndex": 0,
      "hoverAnimation": false,
      "tooltip": {}
    },
    {
      "name": "Raw Test Device",
      "type": "line",
      "showSymbol": false,
      "lineStyle": {
        "width": 1,
        "color": "#FFAE58"
      },
      "itemStyle": {
        "color": "#FFAE58"
      },
      "data": [
        [
          1535672110000,
          84
        ],
        [
          1535672120000,
          73
        ]
      ],
      "xAxisIndex": 1,
      "yAxisIndex": 1,
      "hoverAnimation": false,
      "tooltip": {}
    }
  ],
  "title": {
    "textStyle": {
      "fontWeight": "normal"
    }
  },
  "toolbox": {
    "show": true,
    "feature": {
      "saveAsImage": {
        "title": "save",
        "type": "png"
      },
      "dataZoom": {
        "title": {
          "zoom": "zoom",
          "back": "back"
        },
        "yAxisIndex": false
      },
      "restore": {
        "title": "restore"
      },
      "magicType": {
        "type": [
          "line",
          "bar"
        ],
        "title": {
          "line": "line",
          "bar": "bar"
        }
      }
    },
    "right": "20px",
    "top": "-2px"
  },
  "tooltip": {
    "trigger": "axis"
  },
  "axisPointer": {
    "link": {
      "xAxisIndex": "all"
    }
  }
}
```
Then when I change to the following option, the error comes

```
"{
  "grid": [
    {
      "height": 180,
      "right": 50,
      "left": 100,
      "top": 40,
      "backgroundColor": "#FFF",
      "show": true
    },
    {
      "height": 180,
      "right": 50,
      "left": 50,
      "top": 270,
      "backgroundColor": "#FFF",
      "show": true
    }
  ],
  "xAxis": [
    {
      "gridIndex": 0,
      "type": "time",
      "position": "bottom",
      "splitLine": {
        "show": false
      }
    },
    {
      "gridIndex": 1,
      "type": "time",
      "position": "bottom",
      "splitLine": {
        "show": false
      }
    }
  ],
  "yAxis": [
    {
      "name": "Raw Test Device",
      "type": "value",
      "scale": true,
      "gridIndex": 0,
      "splitLine": {
        "show": false
      },
      "position": "left",
      "nameLocation": "center",
      "nameTextStyle": {
        "fontStyle": "Open Sans",
        "color": "#777",
        "fontSize": 16
      },
      "nameGap": 30,
      "offset": 50
    },
    {
      "name": "Raw Test Device 2",
      "type": "value",
      "scale": true,
      "gridIndex": 0,
      "splitLine": {
        "show": false
      },
      "position": "left",
      "nameLocation": "center",
      "nameTextStyle": {
        "fontStyle": "Open Sans",
        "color": "#777",
        "fontSize": 16
      },
      "nameGap": 30,
      "offset": 0
    },
    {
      "name": "Raw Test Device",
      "type": "value",
      "scale": true,
      "gridIndex": 1,
      "splitLine": {
        "show": false
      },
      "position": "left",
      "nameLocation": "center",
      "nameTextStyle": {
        "fontStyle": "Open Sans",
        "color": "#777",
        "fontSize": 16
      },
      "nameGap": 30,
      "offset": 0
    }
  ],
  "series": [
    {
      "name": "Raw Test Device",
      "type": "line",
      "showSymbol": false,
      "lineStyle": {
        "width": 1,
        "color": "#2FBD68"
      },
      "itemStyle": {
        "color": "#2FBD68"
      },
      "data": [
        [
          1535672110000,
          84
        ],
        [
          1535672120000,
          73
        ]
      ],
      "xAxisIndex": 0,
      "yAxisIndex": 0,
      "hoverAnimation": false,
      "tooltip": {}
    },
    {
      "name": "Raw Test Device 2",
      "type": "line",
      "showSymbol": false,
      "lineStyle": {
        "width": 1,
        "color": "#5AD0C2"
      },
      "itemStyle": {
        "color": "#5AD0C2"
      },
      "data": [
        [
          1535672110000,
          0.21899878121466443
        ],
        [
          1535672120000,
          1.397546677581849
        ]
      ],
      "xAxisIndex": 0,
      "yAxisIndex": 1,
      "hoverAnimation": false,
      "tooltip": {}
    },
    {
      "name": "Raw Test Device",
      "type": "line",
      "showSymbol": false,
      "lineStyle": {
        "width": 1,
        "color": "#FFAE58"
      },
      "itemStyle": {
        "color": "#FFAE58"
      },
      "data": [
        [
          1535672110000,
          84
        ],
        [
          1535672120000,
          73
        ]
      ],
      "xAxisIndex": 1,
      "yAxisIndex": 2,
      "hoverAnimation": false,
      "tooltip": {}
    }
  ],
  "title": {
    "textStyle": {
      "fontWeight": "normal"
    }
  },
  "toolbox": {
    "show": true,
    "feature": {
      "saveAsImage": {
        "title": "save",
        "type": "png"
      },
      "dataZoom": {
        "title": {
          "zoom": "zoom",
          "back": "back"
        },
        "yAxisIndex": false
      },
      "restore": {
        "title": "restore"
      },
      "magicType": {
        "type": [
          "line",
          "bar"
        ],
        "title": {
          "line": "line",
          "bar": "bar"
        }
      }
    },
    "right": "20px",
    "top": "-2px"
  },
  "tooltip": {
    "trigger": "axis"
  },
  "axisPointer": {
    "link": {
      "xAxisIndex": "all"
    }
  }
}"
```

Note that the Raw Test Device 2 was added to the index 1. and then Raw Test 
Device 1 was moved to the index 2.

I would really appreciate your help

[ Full content available at: 
https://github.com/apache/incubator-echarts/issues/8986 ]
This message was relayed via gitbox.apache.org for [email protected]

Reply via email to