I'm using Flot with jQuery to display a graph. I want to update some information on the graph and then re-plot it. I can see that I can use plot.getOptions().yaxes[0].max for example to update the y-axis max value and have got that to work but I'm using a plugin to add side notes to the graph.
I've used getOptions again to update the side notes data and can read the side notes' data, but can't see how I can get the side notes displayed data to update without completely re-plotting the graph.
Any suggestions?
Since you have to redraw anyway, generating a new plot with the new options is the simplest solution. You do not gain much by trying to optimize it (unless you want to redraw every second).
Related
So basically I have been working with some code to try and use a checkbox to hide/show a graph, the big issue is that the graph is made using dygraph and the graphs are made from a csv file's data therefore there is no specific line of code that the graph corresponds with. I am basically stuck because I really don't know how to get around this problem. I can go in to the website once the data is inputed and show/hide the graph that way however different file will have different amounts of data so I can't just do that every time.
When you create the graph, you specify a div that the graph should be drawn in. Can't you simply show/hide that div?
I am new to d3, working on updating the line chart dynamically based on interval, i want the old data to be moveout/exit and update with new data, i am stuck at a position where i can see new data joins the chart but old data is not moving out/exiting. Can someone please help me out on this issue, any help is much appreciated.
Copied from d3noob'slink with little variation of injecting data to chart
Plunker link
Also i am trying to add the circles for each point, currently the single circle is added on top of Y-axis for some reason.
While checking d3noob's link I realized that he's using 2 datasets as data.csv and data-alt.csv. During the second run of updateData function it always gets data-alt.csv
So, in order to answer your question,
First, you need to get your data generation logic correct. Since you are generating random numbers you need to make sure your randomPoints() function generates proper dates that are understandable to D3
Then bind the randomly generated dataset to your data variable.
Finally, clear your data variable in every run of updateData function.
I have made a Plunker for you. Let me know if you need more explanation on this.
Hope this helps :)
Here is the fiddle.
What I am trying to accomplish:
I want to poll the server for data, then populate the entire bar graph. After which I want to update the bar graph in realtime (or say every 1 minute).
This site uses a graph (at the bottom) very much like what I'm trying to do.
As you can see, the initial data gets plotted, and then the graph updates, but I am stuck on how to update the ticks at the bottom, so the original data slides out to the left.
I am using the method suggested here: Realtime chart using flot jquery
I've tried using this, but doesn't do the trick:
yaxis: {
ticks: [1,2,3]
}
You need to change the plot_bot.getOptions().xaxes[0].min
Here is a example
I am trying to plot data collected live from bee hives. We plan to collect data every 5 minutes, so in a year there will be on the order of 100,000 data points. I want to set up a chart to plot the data, and have new data enter the chart everytime the database changes (using Meteor).
I have a simple mockup at datacomb.meteor.com These charts were made using dc.js, a d3 wrapper.
Is there a way to use the topojson.simplify (http://bost.ocks.org/mike/simplify/) functionality to pre-process the lines and reduce the number of points rendered? Has a more general simplification method been integrated into d3?
Have you looked at Simplify.js? It does exactly this.
Anyone know if there is a way to hide the view finder, while still having the chart display a subset of the data? If I filter the data before sending it to the chart, the chart lines are skewed instead of contiguous.
I'm trying to filter on a date range subset of the data, while keeping the lines contiguous with the entire set of data.
I noticed in the source, on line 362, they filter on !d.disabled. I'm wondering if I can hook into that somehow. Does anyone know the proper usage pattern for this?
The view finder is actually Square's Crossfilter found here [0] if you wanted to browse the source and view more documentation.
However, I would just set the display attribute to none in CSS of the svg containing the crossfilter and be done with it.
[0] http://square.github.io/crossfilter/