Highcharts Demo

author(s): Torstein Hønsi

by AbhishekRohan

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>


<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

var osname = "ios";
Highcharts.chart('container', {
chart : {
							type : 'column',
							//marginLeft : "-2",
						/* 	height : (osname == "ios" ? 830 : (osname == "iosPlus" ? 780 : (osname == "iPhoneX") ? 830 : 770)) */
						},
						title : {
							text : ''
						},
						credits : {
							enabled : false
						},
						xAxis : {
							categories : ['AMER', 'APAC', 'AMEA'],
							tickLength : 0,
							tickWidth : 0,
							lineColor: '#E7E7E7',
        					    lineWidth: 1,
        					labels : {
							align : 'center',
							style : {
								color : '#666666',
								fontSize : "35px",
								fontWeight : 'normal',
								fontFamily: 'Metropolis-ExtraLight',
								textOverflow : 'none',
								whiteSpace : 'nowrap'
							}
						}

						},
						yAxis : {
						//	min : 0,
						gridLineWidth : 0,
							tickLength : 1,
							tickWidth : 0,
							lineColor: '#E7E7E7',
        					    lineWidth: 1,
							labels : {
							align : 'center',
							formatter : function() {							
										//return formatNumber(this.value, "$");
								},
							style : {
								color : '#666666',
								fontSize : "25px",
								fontWeight : 'normal',
							   	fontFamily: 'Metropolis-Regular',
								textOverflow : 'none',
								whiteSpace : 'nowrap'
							}
						},
							title : {
								text : ''
							},

						},
				/* 		legend : {
						  symbolHeight : 20,
						  symbolWidth : 20,
						  symbolRadius : 10,
						  symbolPadding : 20,
						  itemStyle : {
						    color : '#555555',
						    fontSize : '30px',
						    fontWeight : 'normal'
						  },
						  itemDistance : 30,
						  itemMarginTop : 40,
						}, */
						tooltip : {
							enabled : false
						},
						plotOptions : {
							series: {
							animation : (osname == "iPhoneX" || osname == "ios" || osname == "iosPlus") ? true:false,
                           enableMouseTracking: false 

						},
							column : {
								pointWidth : 40,
							/* 	 ...