bigDataApp/components/highcharts/highcharts.vue

<template>
	<view class="">
		<highcharts :options="chartOptions" :style="styles"></highcharts>
	</view>
</template>

<script>
	import {
		Chart
	} from 'highcharts-vue'
	// import Highcharts from 'highcharts'
	// import HighchartsNoData from 'highcharts/modules/no-data-to-display'
	// HighchartsNoData(Highcharts)

	export default {
		props: ['chartOptions', 'styles'],
		data() {
			return {
			}
		},
		onLoad() {
			this.initChart();
		},
		methods: {
			initChart() {
				console.log(this.$el);
				this.$el.style.width = (this.styles.width || 800) + 'px';
				this.$el.style.height = (this.styles.height || 400) + 'px';
				this.chart = new Highcharts.Chart(this.$el, this.options);
			}
		},
		components: {
			highcharts: Chart
		}
	}
</script>

<style lang="scss">
	.highcharts-container {
		width: 800px;
		height: 400px;
	}
</style>