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.
Related
I am trying to display an interactive tool-tip on box plot data points with dc.js. i tried different ways with d3 and mouse event to display the tool-tip. But the data which comes when mouseover on point is 0 1 2 like the indexes of dots.
Does it possible to achieve result like second pic with dc.js or customizing with d3 anything ?
I am using the latest version of d3.js and dc.js. Can anyone help me with the little code and suggestion etc. i am unable to resolving such issues.
I created a grouped-stacked composite chart using dc.js.
I am wondering if I can add a filterHandler to a composite chart.
I want to filter on each stacks.
It seems that, there is no straight forward way to build a composite chart and hook the parent chart to the volumeChart that would filter all the individual child components at once via dc.js, as Gordon suggested. I came up with a solution for one of my dashboards which is not so modular but works fine & also keep in mind the downsides to this approach pointed out below.
For the above dashboard to work, I defined 3 barCharts and 3 lineCharts overlaid on top the barCharts and chaining them all together linearly to volumeChart.
Although this works fine with a fixed y-axis scale, lineChart fails to align with the barCharts when the I set elasticY(true) on all of them, since the lineChart components seem to pic its own yMax and when I pass the yMax value as window.value from barCharts to the lineChart via .on('renderlet'..., again I fail to read these values due the misalignment of individual chart render times. And of course when I overlay the lineCharts I intrinsically loose/block the interaction with the barCharts and use the line moving average tooltips to view bar data.
I have not tried this yet but found a better way to do the same from Scott Miller - https://stackoverflow.com/a/25188909/5743716
Hope it helps!
I have a stacked multiBarChart created with nvd3: jsfiddle is here: http://jsfiddle.net/e3kxZ/5/
(1) How can I get each region to display its value near its top?
I tried showValues(true) but I don't think that's supported in multiBarChart.
Other concerns I have are:
(2) how to set the text color so that it contrasts enough with the region (dark vs light colors), and
(3) how to keep the text labels from overlapping if any particular region is small.
I found an svg example (doesn't use nvd3) -- it assumes a static size for the chart, but I'd prefer to use something convenient and dynamic like nvd3.
Alternatively, if there is a different js library that supports this out of the box, please let me know and I'll use that instead.
Thanks in advance for any help!
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.
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.