[Feature] Highlight a line using dispatchAction 'highlight'

[weihaopeng]

What problem does this feature solve?

I want to highlight a node, and its path to the root node. I use dispatchAction function with type highlight, set the nodeIndex in the path to dataIndex attr. Like this (node11 is the root node):

The result is :

• node11 was highlight
• node11's related node(include node24) and line were highlight
• node40 was highlight, but the line connecting node24 and node40 weren't highlight`.

Then I reverse the dataIndex, set [40, 24, 11]. I get the result:

• node40 was highlight
• the line connecting node40 and node24 was highlight, node24 was highlight
• node24's related node was highlight
• node11 was highlight, node11's related nodes weren't highlight.

I think this is a defect. It seems that it highlight first node and first node's related nodes and their lines, and other node in the dataIndex list. But according to the doc, dataIndex means "数据项的index", 'index of data'. It should Has nothing to do with line, and any related nodes(maybe this is conflict with the emphasis.focus: 'adjacency' ?)

Above content should be a bug or a defect, I think. here comes the feature I want. Add linkIndex or edgeIndex attr to the option in dispatchAction function. So that developers can clearly define which line should be highlight.

code is here, it use les-miserables in document. After mounted, waiting 3s, I use a dispatchAciton function to highlight three nodes.

The node11 is the green node Valjean, the node24 is the purple node Thenardier, the node40 is the top node with label hidden.

What does the proposed API look like?

dispatchAction({ type: 'highlight', ...

dataIndex?: number | number[], // only effect these data, no effect to related data.
name?: string | string[],
lineIndex?: number | number[]

});

[weihaopeng]

I found this in the test file.

I tried chart.dispatchAction({type: 'highlight',dataIndex: [0,1,2,3],dataType:'edge'}). It worked. Plz add this to your doc.

[weihaopeng]

Also, I found that if I use two highlight functions at the same time, e.g. :

chart.dispatchAction({type: 'highlight',dataIndex: [0,1],dataType:'edge'})
chart.dispatchAction({type: 'highlight',dataIndex: [0,1,2,3]}) // node

The node highlight function will downplay the lines' highlight firstly, then highlight nodes. I don't think it's right. With this, I cannot highlight multiple nodes and lines in the same time.(Cannot write them in a function, too.)

[github-actions[bot]]

This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.

[github-actions[bot]]

This issue has been automatically closed because it did not have recent activity. If this remains to be a problem with the latest version of Apache ECharts, please open a new issue and link this to it. Thanks!