I am looking to create a line chart which will plot an array of data which has a corresponding x value (date/time) and y value associated with it. The chart can have any number of series (different lines on the same graph). You can think of this as like how yahoo/google graph a particular stock and if you want to compare different companies stock prices on the same chart.
The problem I am facing is that the data I am given might not be given in regular intervals (e.g. series 1 might give an array of plots that occur every 15 mins, series2 might be 10 mins, etc). Also the data might not have the same start / end time (e.g. series 1 starts at 8:40 am, series 2 starts at 8:42 am). There can also be holes in the data where no data was gathered (want to display this as nothing in the chart)
I have thought about some potential ways to solve this problem
Put everything on a 1 minute interval (the smallest possible interval) and place null values for everything we do not have data for. I need to have null values because there are datatips on the graph when you hover over a point to tell you what the value is at that point. The problem with this is that this will cause the graph to become a point graph rather than a line graph and will look ugly. I can tell dojo to interpret the data between null values but I also want to have explicit null values (e.g. when the market is not open leave the space as nothing rather than connecting the lines)
Round the data to the closest interval. The problem with this is the data is no longer accurate for that particular moment which is a problem.
Don't allow them to be plotted together (not an option).
Use a different charting library (last resort)
I am using the dojox charting library and I cannot change the back end code that gives me the data.
What are my options?
Related
I have a stacked area chart that I'm building using D3.js, but I haven't been able to figure out how to get the end-points of my data to behave properly. Here's a screenshot showing the "issue" I'm seeing:
The data associated with both the orange and dark blue segments start on the beginning of their corresponding months (February 1 and March 1, respectively). However, because the default interpolation mechanism "smooths" the curves, it appears as if non-zero values are present on days prior to the start of the month.
How can I get these end-points to drop vertically? I'm aware of the step-before and step-after interpolation models, but I like the look of the default chart. I simply want the ends to "behave" properly. Here's a mockup of what I envision it would look like:
Is this kind of thing even possible?
To be complete, I ended up switching to the step- style interpolations for my graph, since it provides a more accurate picture of my data.
I am using Highstock.js to build a stock ticker that spans three days. I am using a line to graph the S & P 500 vs time, and I have a data point for every minute the market is open. I also have a feed sending a new data point every minute. When the page loads the previous two days of data is loaded into the chart, plus all the data available so far today. Then I update with new data each minute.
All data is displayed correctly, but I am trying to split the x-axis into thirds (with no gaps). Each third would correspond to each day. This means the last third would only be partially filled while the current day's data is coming in. The line graph would be moving toward the edge of the chart.
The issue I am running into is that the line always fills the entire chart.
I have tried setting the xAxis.max, but this doesn't work unless I set xAxis.ordinal = false. but that leaves gaps for nights, weekends, holidays, etc...
I have also tried sorting and ignoring the x value, but it has become a headache to account for weekends and holidays. Plus I don't know how to get the axis labels back to the correct time.
Basically I'm asking, Is it possible to create a chart that is only partially filled, without ordinal = false
I'm trying to plot oscilloscope time traces using highcharts/highstock. The problem is highstock only takes the xAxis as date values. I can't figure out how to force it to only use seconds (because then I could just change the label to nanoseconds).
Highcharts on the other hand can plot anything really but doesnt have the advanced data grouping features that I need to plot these long (and sometimes concatenated - i.e. SUPER long) time traces.
I could go server side with it but I don't think anything beats highcharts in terms of usability and flexibility.
Anyone have any advice?
Have you consider to modify labels, by formatter ?
http://api.highcharts.com/highstock#xAxis.labels.formatter
http://api.highcharts.com/highstock#highcharts.dateFormat()
I need to display a javascript chart with up to 8 series that vary wildly in values. Some of the series will display 0-1 values, and the rest of them could be anywhere from 0-1000000.
How can I display this data simultaneously on a Javascript chart? The problem I run into with jqPlot (what I'm used to) is it will display all the series but it's impossible to tell the values that go from 0-1 apart from each other and whether they are 0 or 1 at that moment in time.
X axis will always be a datetime range.
I'm used to jqPlot but couldn't figure out a way to do it. I'm open to other javascript solutions.
I'm persisting every application error I get to our DB, and exposing it as an endpoint that gives a time series of errors:
[[1354445413000,1],[1354445502000,1],[1354445522000,1]]
Format is (Timestamp, 1), (second value is always 1), the series contain a value per error I have in the system.
What's the easiest way to get HighCharts to show a periodic aggregate chart with drilldown - something that shows N error events per day, and can be drilled down to an hourly or zoomed out to a weekly resolution? (note that zooming changes the actual data being displayed, not just the resolution).
Drill-down & zoom out are not essential, my first focus is just getting HighCharts to aggregate the data for me.
HighCharts will not aggregate data for you - it takes a string of data points and plots them. Perhaps you should look at their other charting library HighStock and the dataGrouping method. The dataGrouping system is pretty good - lets you decide what kind of aggregate to use (sum, average, etc) and you can tell it what to group by in time units down to a millisecond.