Convert submission monitor chart to ECharts#3677
Conversation
Part of our ongoing effort to replace D3 with Apache ECharts throughout the site. In combination with Kitware#3677, D3 is no longer a dependency of the Vue portion of the site.
josephsnyder
left a comment
There was a problem hiding this comment.
Something isn't quite right but I'm not sure what is happening:
On page load, the Success/Fail legend seems to be the one receiving the zoom events as it has a scroll bar:
Once the mouse wheel is used to zoom, the scroll bar goes away and background lines appear in the legend:
All the other relevant data from the API call is properly presented on the screen, but there isn't any visible points despite
The TimelinePlot Vue component was originally designed to be the replacement for all other plots across the site, first introduced on the submission monitor page. Since then, we've decided to use Apache ECharts instead of this D3-based approach. This PR completely rewrites TimelinePlot.vue with ECharts. The new plot is functionality equivalent, with a handful of minor UI improvements.
bdd0b11 to
7b77041
Compare
|
@josephsnyder Fixed. |
josephsnyder
left a comment
There was a problem hiding this comment.
Things look pretty good. I'm happy with the zoom and the legend which will makes hiding a line easy.
I'm a little confused on the click and dblclick, they don't seem to do anything currently.
Are they working as intended for you?
Part of our ongoing effort to replace D3 with Apache ECharts throughout the site. In combination with Kitware#3677, D3 is no longer a dependency of the Vue portion of the site.
|
@josephsnyder I removed the double click action because it's unnecessary. The click action isn't meant to be used for the monitor plot--there's nothing to link to, so it's an unused feature of the TimelinePlot. |
The TimelinePlot Vue component was originally designed to be the replacement for all other plots across the site, first introduced on the submission monitor page. Since then, we've decided to use Apache ECharts instead of this D3-based approach. This PR completely rewrites TimelinePlot.vue with ECharts. The new plot is functionality equivalent, with a handful of minor UI improvements.