I need to create a multibar chart using NVD3.js. All the example are showing bars belongs to the same Y1-Axis. I need to show bar1 for Y1-Axis and bar2 for Y2-axis.
Is it possible? How can I achieve it?
It's not possible with NVD3 as it's built for re-usability. You could try drawing multiple bar charts alongside each other or try using pure d3.
Have not done/tried stuff like this.
If you manage to find a solution, please do share your solution. It's interesting.
Update
Have you noticed how the charts in the NVD3 homepage work. All 4 charts change based on the selection of categories on the MultiBarChart legend. You could try something similar.
Related
I am looking to create a chart with nvd3 that looks like the one below:
In this chart, it is essentially a nested x-axis where I have a price ranges, and I am tracking the prices from different stores (and the categories within each store) in those ranges. I know I can do a simple chart with just one store and then I wouldn't need the nested x-axis, but I need to be able to do the side-by-side comparison as well.
Looking through the examples and documentation, it appears that nvd3 does not support this advanced chart type. I have used nvd3 to create plenty of simple bar charts, but this is my first attempt at a more advanced chart. If nvd3 does not support this, is there a library outside of d3 itself that you can recommend. I have looked at dimple.js, but it does not look like that it is being actively supported as the last commit was in 2016.
Consider the Kendo scatter chart HERE in the telerik demos. What I want is to visually separate the chart area with some background colors. As I know Kendo itself doesn't facilitate such configuration.
I'm tring to solve it within the Kendo. I guess it can be done through svg drawings. But I've never done it before. If it's really impossible is there any way to do it or is there any other scatter chart to fulfill this requirement.(saw somewhat similar thing in google charts)
I'm including the expected result as below.
I came up with this code . It does the exact thing what I want. This is the solution.
Im starting NVd3 development and strugling with a big problem. I already finished my horizontal bar chart.
The problem is that the client asked me to regroup labels into groups, something like this: http://peltiertech.com/WordPress/wp-content/img200804/DualCatBar.png
In that example you can see categories of parts. How can that be archieved suing NVD3 or D3?
Thank you for your help.
I have just started learning d3.js and dc.js.
I want to create bar chart in dc.js with labels, but when I refer the api, it says .label function is not supported for bar chart.
Any idea why label are not supported?
What should i do to show the label just below the top of the every bar?
Thanks in advance.
There's a feature request for this.
https://github.com/dc-js/dc.js/issues/211
While I think I disagree with the person who downvoted your question (without commenting!) it's hard to imagine how this wouldn't have shown up in a web search.
For now I think you'd have to use a renderlet. Although I think I saw someone doing it, that didn't show up in a web search.
I want to add zooming functionality using d3.js in a bar chart created using dimple.js. See following link for what I did so far. http://jsbin.com/rejof/2/edit
I want to combine both zooming functionality in dimple chart. Thanks in advance.
I don't think you can easily do this, you would probably need to modify the dimple source code as I believe zooming relies on a different dom structure to the one dimple uses. You might find it easier to recreate the chart you require in raw d3, rather than modifying a dimple chart to zoom. Of course I'd love to be proven wrong.