Currently, I'm having trouble to force the highstock chart to display a blank space up to the current date. It focuses the data I give it.
What I have is:
What I want is something like this
As you can see I want the data to stop at the date of the latest data point and then the graph should show a blank space and stop at the current date. Obv there is not data points for those times
You can control how empty points, and missing points are shown by looking at:
xAxis.ordinal
In an ordinal axis, the points are equally spaced in the chart regardless of the actual time or x distance between them. This means that missing data periods (e.g. nights or weekends for a stock chart) will not take up space in the chart. Having ordinal: false will show any gaps created by the gapSize setting proportionate to their duration.
xAxis.max
The maximum value of the axis. If null, the max value is automatically calculated.
plotOptions.series.connectNulls
Whether to connect a graph line across null points, or render a gap between the two points on either side of the null.
Which means that for your graph, you will want to set:
xAxis: {
ordinal: false,
max: (new Date()).getTime() //to set the current date and time as a maximum
}
Related
We are using chart.js lib Version 3.7.1.We have multichart graph with line and bars. Both using time scale on x axis, but one has one month value, while second has one day value.
example:
const dailyAxis = [27-05-2022, 30-05-2022, 31-05-2022, 01-06-2022, ... 07-06-2022];
const monthlyAxis = [31-03-2022, 30-04-2022, 31-05-2022, 30-06-2022];
The problem is, that daily values could start from the middle of the month or one month could have 20 daily values, other could have 30. Is it possible to align two charts, to have first daily point at start of monthly bar and last point at the end of monthly bar, no matter how many daily values we have?
I'm graphing weekly total page loads per 1000 students, which is easy enough when the pill for the page load variable is set to 'sum', and the date pill is set to 'week number.'
BUT, I also have a table that lists individual dates on which important policy changes occurred, and I want to draw those as vertical lines.
Using a dual axis, I have been able to plot the specific dates as lines, but because the resolution of the date axis is set to "week", it lumps all dates in the policy change table that occur within a single week into one, or possibly omits dates that don't land on the right date for that week, and therefore I don't get individual lines for every policy change.
weekly resolution, dates omitted
I have been able to approximate what I'm looking for by setting the date pill to 'day,' and then doing a rolling average of the page load values--but this doesn't represent the page loads in the way I need it to.
rolling sum, not the same calculation, but includes dates
I need either a way to layer two charts on top of each other, with different x-axis resolutions, or possibly the correct calculated field that gives me the straight up weekly sum of the daily total page loads for successive weeks, so I can use the 'day' setting on the date-time access but still get the weekly values I want, and then plot all dates in the policy change table.
For a bar or column chart in Highcharts, is there a setting(s) to make it automatically set the min of the y-axis based on the min of the data? For example, if my data values fall between 200 and 300, then the plot doesn't look so good if the chart y-axis starts at 0, but rather it looks much better if the y-axis min is 200.
My current approach is supply the yAxis.min setting the minimum vale from the data subtracted by some "smart offset" (smart offset so that the min of the data is not plotted at the very bottom). The problem is i'm not 100% yet how to calculate that "smart offset" so I'm wondering if Higcharts can do the min from the data for me (rather than supplying it), then it might be able also figure out that offset.
You need to enable softThreshold property:
softThreshold: boolean
When this is true, the series will not cause the Y axis to cross the
zero plane (or threshold option) unless the data actually crosses the
plane. (...)
series: [{
softThreshold: true,
...
}]
Live demo: http://jsfiddle.net/BlackLabel/05tgmz9c/
API Reference: https://api.highcharts.com/highstock/series.column.softThreshold
I am completely new to Cognos, so sorry if I don't state some necessary information. I can't go into specifics about my chart, but here is the background:
I have a SQL code running into my Query
My chart and list use the same Query and have the exact same fields
My chart is a basic line graph
When I change my aggregate function to total for my y-axis, then I can see the data points
I do not want to use an aggregate function (I need to see all the points for my x and y-axis)
My x-axis is only one object, but it has multiple y-axis values within a year (which is my series). Ex:product-cost-year list,
where my product is the x-axis, cost is the y-axis, and series is year.
How can I get my chart to appear with all my data points? Eventually, I would like to add an upper and lower confidence interval to this chart.
One way to solve this issue is to create another column that simply counts the number of products (1,2,3,...9). We will call this column count. Keep all your fields the same (product for x-axis, cost for y-axis, and year for series). You will want to add count underneath product on the x-axis. You should see your mouse pointer turn to a horizontal line and it will place it under and to the right of product. Make sure not to place it just to the right of product.
We have a local webserver which collects data from hardware and another web based app that shows the data on a line chart using JqPlot. Data fetch is done through Ajax.
I wish to show multiple data series on line chart, all having same xaxis values (the time value). The xaxis should be able to show time in minutes.seconds.milliseconds.
I have tried regular lineAxesRenderer, which is good, but shows only upto 1 decimal point, i.e. 25.1 to 25.2. If we have data that changes mutliple times within 100ms, we get different Y values for the same x value. This makes the graph look jagged, when actually we are getting different values for different time stamps.
I have also tried DateAxisRenderer, however in that case...the call to replot() to change the axis before redraw() simply fails. The x-axis data I am sending to the client is "H:M:S.MS" format. My options for x-axis are as follows:
xaxis : {
label : "Time (s)",
show : true,
renderer:$.jqplot.DateAxisRenderer,
rendererOptions : {tickRenderer: $.jqplot.CanvasAxisTickRenderer},
tickOptions: {formatString: "%H:%M:%S.%N"},
tickInterval:'500', // javascript timestamps are in milliseconds
},
What am i doing wrong here?
How do i show 2 or 3 decimal places on the x-axis if I use simple lineAxisRenderer?
Thanks and best regards,
Vishal