Render line chart across the plotting area - highcharts

Question

Highcharts line chart, how to render across plot area.
Trying to render the line chart using HighCharts library to span across the entire plotting area. Using xAxis.min was able to make sure the start is from 0 on xAxis, however, not able to figure out how to make it end where chart plot area ends.
$(function() {
$('#container').highcharts({
"chart": {
"margin": null,
"stacking": "normal",
"height": "250px",
"animation": false,
"events": {}
},
"plotOptions": {
"series": {
"dataLabels": {
"enabled": true,
"inside": true,
"align": "right",
"format": "",
"style": {}
},
"inside": true
}
},
"title": {
"text": null
},
"subtitle": {
"text": null
},
"xAxis": {
"title": {
"text": null,
"align": "high",
"rotation": 0,
"style": {},
"y": null,
"x": null
},
"plotLines": [],
"categories": [
"2019-06-10",
"2019-06-17"
],
"tickInterval": 1,
"tickPositions": [
1
],
"labels": {
"style": {},
"useHTML": true,
"align": ""
},
min: 0.5
},
"legend": {
"enabled": true,
"layout": "horizontal",
"align": "center",
"verticalAlign": "bottom",
"floating": false,
"x": 0,
"y": 0,
"symbolPadding": null,
"symbolRadius": null,
"itemStyle": {},
"itemDistance": null
},
"yAxis": [{
"title": {
"text": "",
"align": "high",
"rotation": 0,
"style": {}
},
"labels": {
"format": "{value}",
"style": {}
},
"opposite": false,
"yAxis": 0,
"lineWidth": 1,
"gridLineColor": "#e6e6e6",
"gridLineWidth": 1,
"gridLineDashStyle": "solid",
"index": 0
}],
"tooltip": {
"enabled": true,
"followPointer": false,
"shared": false
},
"credits": {
"enabled": false
},
"series": [{
"type": "line",
"name": null,
"fillOpacity": 0,
"color": "#0077bc",
"fillColor": "#0077bc",
"opposite": false,
"yAxis": 0,
"legendIndex": 1,
"marker": {
"enabled": true
},
"dashStyle": "Solid",
"data": [{
"y": 396,
"toolTipData": "<div>Times on Air : 396</div><br/>"
},
{
"y": 468,
"toolTipData": "<div>Times on Air : 468</div><br/>"
}
],
"_symbolIndex": 0
}]
});
});
https://jsfiddle.net/fzg0evns/

Answer 1

Instead of using dates as x-axis categories you can add a date to point x property and define x-axis type = "datetime". Check the demo posted below.
Code:
"xAxis": {
"type": "datetime",
...
},
"series": [{
...
"data": [{
"y": 396,
"x": new Date('2019-06-10').getTime(),
"toolTipData": "<div>Times on Air : 396</div><br/>"
},
{
"y": 468,
"x": new Date('2019-06-17').getTime(),
"toolTipData": "<div>Times on Air : 468</div><br/>"
}
]
}]
Demos:
With categories, tickInterval, and tickPositions.
Without them.
API reference:
xAxis.type
https://api.highcharts.com/highcharts/series.line.data.x