I have a Plotly chart where I plot some points based on some sensor values (x axis) and the time that value arrived (timestamp - y axis).
The problem is that I receive the values randomly, sometimes a couple of measurements in one second, and sometimes another measurements after a couple of hours.
This causes the chart not to be scaled evenly, which makes sense.
What I would like to achieve is the following: all timestamp values (y axis) should be evenly spaced, and not taking into account the time passed between them.
Is this possible?
Edit: I tried using timestamps as strings, but this causes some weird functionality when using two traces, they won't overlap as they should).
Related
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?
This is for a multiline chart.
I'm displaying 20 points but in between them you might have a gap of days or weeks. This causes the axis to bump the points left and right when looking at a gap of three weeks. in general the points will be hourly, but long gaps may occur. I tried using d3.svg.axis.tickValues to set the values but it still spaces them unevenly.
You need to use a scale
d3.scale.linear().domain([..]).range([...]);
More info here : https://github.com/mbostock/d3/wiki/Quantitative-Scales
I am building a graph with d3, sometimes the graph has smaller numbers on the axis and sometimes the graph has larger numbers on the axis. This causes the following problem from time to time;
Notice how at the left and right hand side the svg element is done and such the entire legend doesnt get displayed. I would prefer not to play around with increasing the margins on either side because that would decrease the screen real estate.
Is there a way such that the axis are responsive with regards to the data input? Ie; when the numbers are in the thousands then a 'k' or an 'm' is added to the number ( 100000 -> 100K, 12000000 -> 12M ).
The function axis.tickFormat() allows you to do exactly that. The formats are described in the documentation for d3.format(). In your case, you need to specify something like
axis.tickFormat(d3.format("s"));
I'm using RGraph's Line charts to plot some chronological data. It works fine, except that the distance between the successive points is always the same - irrespective of whether they are two hours or two months apart. I would like to customize it so that the distance represents the actual time interval between the points. Is this possible using the Line charts or any other charts in RGraph?
I contacted RGraph support with the above question, and they have suggested that I use Scatter charts instead:
You'd be better placed with Scatter chart. With this chart you can set
the maximum X value and the X axis is scaled (which you can show if
you wish).
I have a Flot chart and x-axis displays time - tick size equaling one day. I am displaying durations of events that take place at various times of the day and I would like to stack them. Flot's time mode positions the bars based on milliseconds so the bars are apart in each tick/day. Is there a quick way of making the bars stack up, preventing them from being plotted in different x positions in each day?
Having mixed feelings answering my own question, but I'll do it anyway in case someone runs into a similar issue.
The solution is to convert timestamps to days, round down the decimal in the result, and convert it back to milliseconds using a function like:
Math.floor(date/(1000*60*60*24))*(1000*60*60*24)
Also, make sure to set the tick size to one day in your axis settings declaration:
tickSize: [1, "day"]
As a result, you will end up with day values that stack up beautifully. I ended up doing the conversion on the client side so that I can store precise values, while the graph shows a bigger picture.