[Feature] Standardized id Field in Mouse Click Event Data

[syampillai]

What problem does this feature solve?

Currently, the event data associated with a mouse click varies depending on the type of chart element clicked. For example, when a series is clicked, the seriesId is passed. However, many chart elements—such as xAxis, yAxis, and series—share a common id property.

It would be extremely helpful if this id value were included as a standard field in the event data (e.g., simply as id), regardless of the chart element type. This would allow for straightforward identification without requiring developers to implement complex type-specific matching logic using various properties currently provided.

Developers would still be responsible for assigning unique id values when configuring chart options.

Use Case:
I maintain a Vaadin add-on (SOCharts), which wraps ECharts as a Vaadin component. One of the key challenges I face is identifying the chart element clicked and relaying that information back to the Java application in a standardized manner. A consistent id field across all chart elements in the event payload would greatly simplify this process.

What does the proposed API look like?

{
    // 'id' of the component
    id: string,

    // Others just copied from the documentation

    // type of the component to which the clicked glyph belongs
    // i.e., 'series', 'markLine', 'markPoint', 'timeLine'
    componentType: string,
    // series type (make sense when componentType is 'series')
    // i.e., 'line', 'bar', 'pie'
    seriesType: string,
    // series index in incoming option.series (make sense when componentType is 'series')
    seriesIndex: number,
    // series name (make sense when componentType is 'series')
    seriesName: string,
    // data name, category name
    name: string,
    // data index in incoming data array
    dataIndex: number,
    // incoming rwa data item
    data: Object,
    // Some series, such as sankey or graph, maintains more than
    // one types of data (nodeData and edgeData), which can be
    // distinguished from each other by dataType with its value
    // 'node' and 'edge'.
    // On the other hand, most series has only one type of data,
    // where dataType is not needed.
    dataType: string,
    // incoming data value
    value: number|Array,
    // color of component (make sense when componentType is 'series')
    color: string,
    // User info (only available in graphic component
    // and custom series, if element option has info
    // property, e.g., {type: 'circle', info: {some: 123}})
    info: *
}