Custom legend item tile size & legend item padding
See original GitHub issueFor some of our chart designs, we want to have legend element tiles that were lines rather than boxes - i.e. legend element tiles that look like this:
Also we want to be able to control the amount of space in between each legend element for more fine-grained control over how it is displayed.
So I want to add custom config options for these:
legend: {
// amount of padding to put between each legend element
padding: 5,
// define custom height and width for the legend item tile
item: {
tile: {
width: 15,
height: 2
}
}
}
The default values for width and height would be the current legend item size.
Issue Analytics
- State:
- Created 9 years ago
- Reactions:1
- Comments:7
Top Results From Across the Web
Is there a way to change C3 legend item tiles to be icons?
It turns out the way to do this and keep the colours is to do stuff to the .c3-legend-item-tile(s). Since they're rectangles you...
Read more >legend.padding | highcharts API Reference
The legend is a box containing a symbol and name for each series item or point item in the chart. Each series (or...
Read more >Legend in ReactJS Chart Control - Syncfusion
Legend Item Padding. You can control the spacing between the legend items by using the itemPadding option of the legend. The default value...
Read more >Tips and Tricks for Working with Legends in ArcGIS Pro - Esri
Adjust columns: Add more columns until all the legend items fit. The text size for the legend doesn't change, but more columns are...
Read more >Legend Tutorial - ZingChart
To add a legend, create a legend object. The default legend appears like so, with each legend item corresponding to a series from...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
This useful configuration is not in the doc yet. That’s too bad! I just found it thanks to Google.
Item padding isn’t working when legend is ‘inset’:
Inset https://jsfiddle.net/rogeriolino/by8vwsa5/
Default https://jsfiddle.net/rogeriolino/by8vwsa5/4/