echarts [Feature] Drag and drop scatter point into a quadrant chart

cl25kdpy  于 4个月前  发布在  Echarts
关注(0)|答案(3)|浏览(68)

What problem does this feature solve?

I would like to create a quadrant chart with scatter plots that looks something like this where the user is able to dynamically add/remove plots and shift it around the different quadrants (drag-and-drop). The user will also be able to save the absolute positions of the scatter plots which can be re-rendered on page refresh.

I came across this example that allows for dragging of scatter points, was wondering if there are any examples of such a quadrant chart so that I can achieve such a feature?

Thank you!

What does the proposed API look like?

No new API is required, just need some advice on how to create such a quadrant chart.

zlwx9yxi

zlwx9yxi1#

I think this is probably possible with Apache ECharts. We have a demo for draggable charts. As for quadrant chart, this can be easily done with graphic.elements-rect, with which you can draw four rectangles with different colors.

tzxcd3kk

tzxcd3kk2#

Thanks @Ovilia! For the graphic.elements-rect, is there a way I can draw the 4 rectangles such that it is mobile responsive by specifying the relative widths and heights instead of absolute pixels? Also, based on the draggable chart demo, it seems that the setTimeout function overwrites the rectangular rect that I tried to create. Is there a way to prevent this conflict?

b4lqfgs4

b4lqfgs43#

Similar to #17354 , #18385 , #16401 , #12698 . This is achievable with ECharts

See also video clip

相关问题