Examples: Add pie and donut charts #88
Conversation
✅ Deploy Preview for ods-charts ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
Hi, I push 3 commits, 2 suggestion and one enhancement. Available to discuss about them :) |
docs/examples/index.js
Outdated
| <label for="usedLegends" class="form-label">Legends</label> | ||
| <select class="form-select" aria-label="Line style" id="usedLegends" onchange="changeTheme('${id}')"> | ||
| <option value="echarts" >Not managed by ods-charts</option> | ||
| <option value="odscharts" >ods-charts legends</option> |
There was a problem hiding this comment.
The legend seems to be adapted to each kind of chart. See the https://design.orange.com/0c1af118d/p/88be1e-line-chart/t/74b580, https://design.orange.com/0c1af118d/p/13c921-pie-and-donut-charts/t/10ead7 and https://design.orange.com/0c1af118d/p/86422a-geographic-data/t/19d774 Should we adapt the legend in consequence ?
There was a problem hiding this comment.
You're right : there are three types of legend to manage.
NB: it should be possible to choose a legend type independently of the graph type, even if there is a default legend type for each graph type.
As far as the scope of this MR is concerned, this means being able to have the captions vertical.
| popoverTemplateInput = 'internal'; | ||
| } | ||
| if (!usedLegends) { | ||
| usedLegends = 'echarts'; |
There was a problem hiding this comment.
I'd prefer defaulting to ods-charts one 🤔 What do you think ?
There was a problem hiding this comment.
I asked myself the question.
If the aim is to limit specific dev, then it's better to use the default behaviour of Apache Echarts, provided that the design generated with Apache Echarts legends and adapted by ods-charts is considered satisfactory.
- To use ECharts legends: the look&feel is satisfactory
- To use ods-charts legends: behaviour at the limits of Apache Echarts can lead to the internal legends and the graphs being superimposed.
|
#158 has been merged, please apply the same modifications here. |
Commited |
…difications here
louismaximepiton
force-pushed
the
main-lmp-pie-donut-charts
branch
from
e6a43f7
to
3a74eeb
Compare
Note: Please transform
- [ ]into- (NA)in the description when things are not applicableRelated issues
NA
Description
Added an example showing a pie and a donut charts.
Questions still to be answered:
ods-donut-charts.png.getThemeOptionsaccordingly ? For example we don't haveaxison this kind of chart.Motivation & Context
These type of charts are considered as basic and are missing inside the doc.
Types of change
Test checklist
Please check that the following tests projects are still working:
docs/examplestest/angular-ngx-echartstest/angular-tour-of-heroestest/htmltest/reacttest/vuetest/examples/bar-line-charttest/examples/single-line-charttest/examples/timeseries-chart