I am working on d3.js and dc.js libraries from few weeks. I have created scatter plot in d3.js and bar graph in dc.js. I want to know that is there possibility to interact between these two different graphs created in two different javascripts. In short, is it possible to interact between two different graphs created in d3.js and dc.js?
thank you.
Not going to give you the codes, sorry.
You'll want to use crossfilter as the bridge between the graphs, though:
create a dimension which is for the scatterplot (different from the dimensions used in the dc.js charts, but same crossfilter instance)
react to the interaction in d3 and set the filter on that dimension
Often when creating a dimension for a scatterplot, you will use a key that is unique for each row, or barring that, the row index itself. If you search around for dc.js scatterplot or bubblechart, you ought to find examples.
Also dc.js has a scatterplot now. It needs some love and is not as feature-rich as the bubble plot, but it exists.
Related
I am trying to plot daily tasks in what i would describe as a discontinuous stacked bar graph. Another description would be a vertical gantt chart of past events.
If the description is lacking, the result i want is something like that shown in the image below (made in paint).
All task have a duration (from-to time) and can have different categories which results in different colours with belonging legends.
I have been playing around with two javascript plotting libraries; chart.js and plotly.js, and looking at others but i haven't found anything that can do what i want to achieve. Both chart.js and plotly have stacked bar graphs, but i see no way of getting spaces in between the bars and getting the legends right.
Do anyone have an idea if this is possible in any these two libraries? If not is there an alternative library where this can be done?
Regards
I'm searching for a chart tool to integrate into my app and I really liked the Chartist.js but I couldn't found any resources showing how to create bubble charts like this one in D3.
My goal is to create a non-overlapping bubble chart with images.
I would like to know if there is a way to achieve this natively or with a plugin.
I am trying to make a dynamic graph something like as below:
Y-axis gives no. of users and x axis date range(For continuous graph )
x axis gives release of an algo on that date.(For discontinued graph)
I tried combined charts of highchart this and looked in google charts library.
Is there any way by how i can either directly generate a similar chart or merge two chart types in to one? Preferably using high charts or google graphs.
I guess we can merge two highcharts in to one but I am not very sure about it, also if we can Iam not sure how to do that.
Any help is appreciated.
Thanks
I am aware that you said "Preferably using high charts or google graphs", but I want to point out that this can be done very easily in C3.js using the "types" parameter to specify the graph type for each data item.
Demo: http://c3js.org/samples/chart_combination.html
I would suggest using plot bands to indicate release dates and types. You can dynamically add them using the addPlotBand() method (see http://api.highcharts.com/highcharts#Axis.addPlotBand). They would then overlay your "run of the mill" line chart showing number of users over time.
Assuming you have data that can distinguish between the release types, you could write code that adds a plot band of the desired color at the specific points on the x-axis.
I'd suggest making the plot bands have a from and to value thin enough (say, one interval or one date's worth) so it shows up as the thin stripes in your example.
You'd need to add a manual legend to show users what those colors mean, since plot bands wouldn't automatically show up in a Highcharts legend.
I hope this helps!
I have 3 similar pie charts. They use same dimension but different groups so, their legends look the same. Instead of having 3 same looking legends, I'd like to bind only a single legend to those charts. I tried creating a legend separately and assign it to the charts, however, it didn't work. Is there actually a way to do such thing?
This is not directly supported by dc.js, but it is very similar to a legend on a composite chart. I think if you were willing to do some hacking, you could override the legendables function on the chart you want to put the legend with, and have it accumulate the legendables from its sibling charts.
Take a look at pieChart.legendables:
https://github.com/dc-js/dc.js/blob/master/src/pie-chart.js#L419
And then compositeChart.legendables
https://github.com/dc-js/dc.js/blob/master/src/composite-chart.js#L363
for inspiration.
If this is too much hacking for you, please file an issue. It would certainly be nice to support!
I am looking for some sort of a free JavaScript/JQuery graphing library that has a lot of scatter plot functionality. Ultimately, I want to link the plot up with a SharePoint list and drop it in a collaboration site; in such a way it will dynamically update.
My difficulty is that I want a scatter plot where I can change the x-axis and y-axis values to strings (i.e.; x-axis employee names, and y-axis proposal names).
I looked at a whole bunch of libraries (i.e.; flot, Dojox, most of the other options in this thread JavaScript Chart Library), but cannot find this funcitonality in free software (pretty sure Fusion Charts has it if you pay).
I also realize what I am creating (a scatterplot with fixed grid employee & proposal name values) is basically just a chart... however there's nothing--to my knowledge--that will allow me to make a dyanmically updating chart.
Can anyone offer any library tips, or advice? I am not experienced enough to know of any "work arounds" for this problem.
jqPlot can do it: jqPlot Home
Scatterplot Examples