I would like to show data from different date intervals in hour granularity in the same xAxis. I would like to show the two charts over each other, not near each other.
I can do it with 2 xAxis. See example: http://fiddle.jshell.net/X3jPh/770/
Is it possible to hide the second xAxis, because as you see in the example both has the same hour intervals.
See the answer here: http://dev.highslide.com/forum/viewtopic.php?f=9&t=9917&p=45544
In your example, it would make more sense to normalize that data first (i.e. adjust the values so that they happen on the same day), then display the data normally.
I do not think it is possible to plot the data in the way you intend. In order to show two different series with different start intervals with the same xAxis, you'll have to resort to some sort of trickery (since the chart is technically displaying two different dates, even if they are the same time).
Related
I am currently using ApexChart to create a Graph where I would like to display the time that a user has been connected to a service (Y axis) depending on the dates of connection (X axis).
However, since a user can log in multiple times in the same day to use the service for different amount of times, and he also may not wish to use the service for multiple month at a time, I am having troubles to find a correct way to handle the X Axis labels: if I show only the date, it is difficult to differentiate the multiple connections made in a single day. On the other hand, if I put the date and the time of each connection, there is too much information on screen when we want to display connections made in a single day.
I would therefore like to change the format of my X-axis labels depending on the zoom: if the data displayed to the user is the data corresponding to the connections made in a single day, then I would like to display the time, and else I would like to only display the time.
I have checked Apex Chart API but I do not see anything on how to get back the visible data, or on how to get back zoom information.
Graph of the duration of connection by day of connection
Thanks in advance for your help :)
The prédéfinie "datetime" type do the job for you as your xaxis categories are dates :
xaxis:{ type: "datetime", }
Here is the example with labels changes when ZoomIn/ZoomOut
example https://apexcharts.com/javascript-chart-demos/area-charts/spline/
I have to program a machine with multiple values throughout the day, and besides, I need to graph a line with these values for intermediate values. To this should link the last point on the graph with the first.
At the moment I created an extra point at the start and end to repeat the last and the first value respectively but in the next day and the previous.
But the problem comes when I change these values and I want to render the graphic (it is an AngularJS application with draggable points plugin in future versions), for example when set the first point to 23:00. I should modify several points, including the extra, but it's very hard, because some of these points are calculated (circles), in fact, only have 3 points in this chart (squares)...
Is there any way to avoid these additional points (at the begining and the end) and use only those with real or calculated values? Have Highcharts some property to create a 24h "cyclic linear chart" or something similar?
Thanks a lot!
I have a master-detail chart that displays several series of values against timestamps in line, spline and column formats, depending on the user's choice.
My issue is that when a range of timestamps (say a whole week) and their corresponding values are missing, the spline, line and master do what is expected and plot a smooth line between the gap. However this is misleading and I would rather it show a break in the line once a given range of timestamps are missed. I have tried connectNulls: false but as both the timestamps and values are missing this does not work.
Is there any way to achieve this? Preferably without looping through the data and adding the missing timestamps and null values, as the intervals are not always regular.
I try to create dynamic highcharts. I use series.addPoint. It works fine but my chart adds points and doesn't move like here - jsfiddle. It can be with 100 points on the screen.
How can I make only 10 points on the screen and hide old points?
http://api.highcharts.com/highcharts#Series
Series.addPoint()'s third argument is a boolean that enables shifting. If your series is not shifting, try setting the third parameter to true.
As for the second part, are you sure you want to "hide" old data? Generally old data should be shifted off the end in a real time graph (which I assume is what you're going for). If you have too many points, you can make your x-axis smaller via Axis.setExtremes(). http://api.highcharts.com/highcharts#Axis
So I am trying to devise a way to create a nifty chart in which the user can zoom. I want to try to create an effect that as the user zooms, the data will become more granular. For example, say we are looking at a count on a date/time.
when you're at default zoom, which is say 3 months, you will see 1 data point every 24 hours. I am trying to get it as you zoom in, and see a smaller chunk for that data to get more granular. Like if you're looking at a day, each hour will get its own data point.
Do you all think it's possible to achieve an effect like this using Jquery Flot? I have all of the data broken down into hours at the beginning, it's just a matter of calculating how much of it should be shown.
I already have the zoom functionality working, but just need to figure out how to make the data change as well.
Thanks!
Flot won't do this automatically; you would have to register a callback on zoom that iterates over the original array to pick out, i.e. every nth sample, then redraws the plot using the results.