Highcharts .vue檔
<template>
<div class="chart" style="weight: 60%">
<div id="chart"></div>
</div>
</template>

<script>
import Highcharts from 'highcharts';
export default {
name: 'helloworld',
data(){
return{
dataList: [{
showInLegend: false,
name: 'NXB1020A',
data: [0, 10],
marker: {
symbol: 'circle',
gridLine:0,

},
color: "#44afa5",
upFlag: true
}]
}

},
mounted() {
this.chart = Highcharts.chart('chart', {
chart: {
type: 'column',
backgroundColor: 'transparent',
plotBackgroundColor:'',
width: 800,
height: 300,
animation: Highcharts.svg // don't animate in old IE
},
credits: {
enabled: false
},
title: {
text: null
},
xAxis: {
labels: {
enabled: false
} ,
categories: ['']
},
yAxis: {
title:{
text:null
},

labels: {
enabled: false
} ,

tickPositions:null ,

},
legend: {
reversed: true,
align:'right',
verticalAlign:'top',
symbolHeight:10,
x:0,
y:0,

},
plotOptions: {
series: {

backgroundColor: '#e6eef7',
width: 800,
height: 300,

showInLegend: true //關掉圖例
}
},
series: [ {
name: 'Shut Down',
color:'#8e8e8f',
data:[80],
},
{
name: 'ldle',
color:'#e6eef7',
data: [40]

}],
});
},
}
</script>