highcharts 曲线面图整理

目前只整理了area的处理

html部分

<div id="container"></div>

js部分

window.onload = function(){
	highcharts()
}
function highcharts(){
	postDate('http://xxxxxx/api/index/price_line','','POST',function(data){
		var res = data.data;
		console.log(res);
		if(data.code==200){
			var h_date = res.date;//服务器获取到的x轴的时间
			var h_data = res.price;//服务器获取到的Y轴的对应价格
			$('#container').highcharts({
				chart: {
					backgroundColor: 'rgba(49,50,61,1)',//背景颜色
					borderWidth: 1,//设置图表边框宽度
					borderColor:'rgba(255,255,255,1)',//边框颜色
					type: 'area'
				},
				title: {
					text: null
				},
				ubtitle: {text: null},
				xAxis: {
					gridLineWidth:'0.5px',//设置X轴线条宽度
					categories: h_date,//x轴显示的时间
					gridLineColor:'rgba(255,255,255,1)',//x轴线条颜色
					labels : {
				        style : {
				            'fontSize' : '8px',//x轴文字的大小
				            'color':'#ffffff',
				        }
				   },
				   tickmarkPlacement:'on'//刻度和文字对齐  不设置默认不对齐
				},
				yAxis: {
					gridLineWidth:'0px',
					title:{text:''},
					opposite:true   //把y轴放在右边  不设置默认放左边
				},
				tooltip: {//点击圆点后的提示框，不设置就显示全部
//						enabled: true,
//						formatter: function() {return '<b>'+ this.series.name +'</b><br/>';}
				},
				plotOptions: {
					area: {
						fillOpacity: 0.3, // 指定所有面积图的透明度
						color:'#FF9C1A',
						marker: {
							enabled: true,
							symbol: 'circle',//圆点的样式
							radius: 3,
            				fillColor:'#fba845'
						},
						dataLabels: {},
						enableMouseTracking: true
					},
					pointStart: 2010//设置x轴开始的时间
				},
				series: [{
					name:'当前价格',
					data:h_data,
					showInLegend: false  //不显示底部文字提示框
				}]
			});
		}
    })
	
}
	```