score:2
You can do it like this
var data = [[1.5032736E12,1.0],[1.504656E12,1.0],[1.5047424E12,1.0]];
var startDay = data[0][0],
endDay = data[data.length-1][0]
isLastDay = startDay == endDay,
dayTick = 1000 * 60 * 60 * 24,
temp = [];
//Create new array with 0 values for each day
temp.push([startDay, 0])
while(!isLastDay) {
startDay += dayTick;
temp.push([startDay, 0])
isLastDay = startDay >= endDay;
}
//Override all values with existing days
for (var i = 0; i < data.length; i++)
for(var j = 0; j < temp.length; j++) {
if (temp[j][0] == data[i][0]) {
temp[j][1] = data[i][1];
break;
}
}
data = temp;
Highcharts.chart('container', {
chart: {
type: 'line'
},
title: {
text: 'Survey'
},
yAxis: {
title: {
text: 'Responses'
}
},
xAxis: [{
type: "datetime",
title: {
text: null
},
dateTimeLabelFormats: {
month: "%e.%b<br/>%a"
}
}],
plotOptions: {
series: {
marker: {
enabled: false
}
},
series: {
connectNulls: true
}
},
series:[{"name":"Questions","data":data}]
});
In this way you will create a new temp array which will have all days between first and last day with 0 values, and after that you just place existing values in temp array.
Here is the updated jsfiddle
score:1
Highcharts doesn't have a functionality out of the box for this. You need to push the missing points into the array before plotting it.
You can use a simple function like this. Given function is written in typescript, you can mould it to your use.
generateDataSet(data: number[][]): number[][] {
const temp: number[][] = [];
data.forEach((d: number[], index) => {
d[0] *= 1000;
if (index !=0) {
if (d[0] - dayTick === data[index - 1][0]) {
temp.push(d);
} else {
let lb = data[index - 1][0];
const ub = d[0];
while (lb != ub) {
lb += dayTick;
temp.push([lb, 0]);
}
}
} else {
temp.push(d);
}
});
return temp;
}
You can definitely improve the answer as there is always scope for improvements. Till then keep coding.
Here is a working demo highcharts-jsfiddle-example.
Source: stackoverflow.com
Related Query
- Set zero for missing data in highcharts
- How to make highcharts default to 0 for missing data
- Highcharts - how to set textShadow for data labels
- Set minimum data interval for y axes on Highcharts
- In Highcharts x-axis -how to set tickmark for unequal numerical (not datetime) data
- Highcharts display label for pie chart using html table as data source
- Highcharts how to make a set number of colors for pie chart data and drilldown data
- HTML table as data source for highstock charts using highcharts
- Using a flask variable as data source for highcharts
- Error: Data source must be a URL for refresh | console error | javascript | Highcharts
- Use Node.js as data source for highcharts
- Highcharts displays series names but missing data points from json source
- Highcharts Set data label border color for each pie slice
- Set Additional Data to highcharts series
- set different colors for each column in highcharts
- Changing data dynamically for a series in Highcharts
- Add additional data to a Highcharts series for use in formatters
- Set highcharts y-axis min value to 0, unless there is negative data
- Highcharts How to Show Loading Animation At Set Data
- Improve highcharts performance for large amounts of data
- Highcharts - How to set custom colors for the series
- Highcharts - set maximum range for yAxis but keep axis dynamic within that range
- how to set dynamic data in highcharts
- Automatically join missing data gaps in Highcharts JS
- Highcharts not displaying data labels for Pie chart in arabic
- How to set a static minimum value for axes in Highcharts
- Use an array of objects for series data in Highcharts
- Highcharts large data set clustering
- Formatting JSON data monthwise for HighCharts using MySQL
- Highcharts - Provide URL's for series data to open clickable link
More Query from same tag
- Highcharts csv data loading and parse into separate array and json
- How can add fade In() effect to each appearance of a div when the mouse click?
- How to avoid horizontal scrollbar in highcharts
- Displaying linechart using angular2-highcharts
- How to zoom in Highcharts Android
- generate candle point for empty date
- Highcharts legends data overlapping issue on set and update data
- Highcharts 5 - Radar Charts with circle round the outside
- Rotating the highchart
- Radar Chart: Label outside the chart
- How to scale Highcharts height on window resize with React
- highcharts highlight selected point (png)
- How to show horizontal line instead of a dot for a single value data in highcharts
- Need to dynamically add menuItem to HighCharts contextButton w/function defined by variable
- Highchart - show values on Chart
- Highstock Stockchart with custom color for single grouped column
- Highcharts: enforce options when adding a serie with addSeries
- Chrome Dev Editor Using Bower and Highcharts Shim
- Highstock align 0 values
- Customize colors for boxplot with highcharter
- How can i have the same radius for each point of series with hover?
- Ruby on Rails, JSON and Highcharts
- Creating a drilldown chart with Highcharts that contain double(multiple) columns for each column (see example for better explanation)
- Highcharts - show markers on zoom event (selection) and hide on reset zoom. Is it possible?
- Poorly Ordered Data Over Websockets
- How can i change highcharts data values by selecting from a dropdown list
- If label doesn't fit in the div of treemap Highcharts it should wrap to second line
- Resize data points with highcharts
- Highcharts: Dynamic drilldown (stacked chart) in Combo Dual Axes
- Set background color to HighChart xAxis labels