Axis chart + Allow overlap
by amrutaJgtp
HTML
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container"></div>
JavaScript
var chart = Highcharts.chart('container', {
"chart": {
"zoomType": "xy"
},
"tooltip": {
"enabled": true,
"shared": false,
"borderWidth": 1,
"borderRadius": 1,
"backgroundColor": "#ffffff",
"style": {
"color": "#000000",
"fontSize": "1rem",
"fontFamily": "Open Sans",
"fontWeight": "normal",
"fontStyle": "normal",
"textDecoration": "none"
},
"crosshairs": [false, false],
"followPointer": true
},
"plotOptions": {
"series": {
"animation": {
"duration": 700
},
"cursor": "pointer",
"allowPointSelect": true,
"showInLegend": true,
"turboThreshold": 0,
"stickyTracking": false,
"events": {},
"point": {
"events": {}
},
"pointPadding": 0.1
}
},
"legend": {
"enabled": true,
"item": {},
"borderWidth": 0,
"layout": "horizontal",
"backgroundColor": "rgba(255,255,255,0)",
"itemStyle": {
"color": "#000000",
"fontSize": "1rem",
"fontFamily": "Open Sans",
"fontWeight": "normal",
"fontStyle": "normal",
"textDecoration": "none"
},
"align": "center",
"verticalAlign": "bottom",
"margin": 0,
"padding": 5,
"symbolRadius": 0
},
"xAxis": {
"title": {
"text": "Month Dim By Month",
"style": {
"color": "#000000",
"fontFamily": "Open Sans",
"fontSize": "1rem",
"fontStyle": "normal",
"fontWeight": "normal",
"textDecoration": "none",
"opacity": "1"
},
"align": "middle",
"margin": 5
},
"opposite": false,
"axisInternalName": "0",
"labels": {
"enabled": true,
"style": {
"color": "#000000",
"fontFamily": "Open Sans",
"fontSize": "1rem",
"fontStyle": "normal",
"fontWeight": "normal",
"textDecoration": "none"
},
"rotation": 330
},
"lineWidth": 1,
...