How to implement such a function?

[echolove38]

1. add and click a custom button on left panel, editor enter a 'chart' mode.
2. onmousedown the canvas, added an chart, such as line chart or bar chart

[jfhenon]

Hello, I moved your question to discussions.
I would look at the "react" extension example showing how to display a button in the left bar and enter into a 'hello world' mode. This is pretty easy to listen to "svgedit" events (mousedown in your example) and interact with svgedit with the svgcanvas.
You would likely have to choose a chart library (echarts, highcharts, ...) if you want advanced charts. My feeling is that the chart should be inserted as a svg "foreign object".

[echolove38]

'hello world' example is too simple, I still don't know how to make an complex extention after I read it.