Conditional colors based on y-values
See original GitHub issueIt would be nice if you could optionally specify a conditional function for the colors, similar to how it’s done in pure d3. My current need for this is to be able to show negative bars in a different color. I poked around in the source code, but it doesn’t seem that this is currently possible.
Here’s how I had envisioned the API, based on the negative bar chart example:
var chart = c3.generate({
data: {
columns: [
['data1', 30, -200, -100, 400, 150, 250]
],
type: 'bar',
colors: {
'data1': function(d) { return d.value < 0 ? '#C00' : '#0C0' }
}
},
grid: {
y: {
lines: [{value: 0}]
}
}
});
I’m going to attempt this myself, but unfortunately due to work constraints, I don’t have time to fully understand the inner workings of the c3 library until this weekend. If I manage to get this working, I’ll be sure to send over a pull request.
Issue Analytics
- State:
- Created 9 years ago
- Comments:8 (5 by maintainers)
Top Results From Across the Web
How to change background color in Excel based on cell value
Navigate to the Home tab, Styles group, and choose Conditional Formatting > New Rule…. On the Home tab, in the Styles group, click...
Read more >How to color cell based on value in Excel? - WPS Office
Coloring the cells based on their values in Excel/Spreadsheet ... Click on the Conditional Formatting button in the Home Tab.
Read more >How to Use Conditional Formatting to Change Cell ... - Got It AI
Did you know that you can change the background color of cells by going into the formatting of the cell? Then, you can...
Read more >How to Change Cell Color Based on a Value in Excel (5 Ways)
5 Ways to Change Cell Color Based on a Value in Excel · Select the range of cells you want to format. ·...
Read more >Highlight Rows Based on a Cell Value in Excel (Conditional ...
Want to highlight rows based on a cell value? In this tutorial, I will show you how to use Conditional Formatting to highlight...
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 Free
Top 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
Given how this change affects the color of the legend rectangle as well, I think it might be a good idea to add a new config option to override legend colors. Something such as:
__legend_colors = getConfig(['legend', 'colors'], {}),
then on the API side:
Hi @masayuki0812 , Love the work.
simple question, if i had 3 different colors that i needed to base my color bars in, is there a way to use @joshpurvis method?
Thanks