You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
74 lines
1.5 KiB
74 lines
1.5 KiB
<template>
|
|
<div ref="chart"></div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import { copyObject } from './utils';
|
|
import Highcharts from 'highcharts';
|
|
|
|
export default {
|
|
beforeDestroy: () => this?.chart?.destroy(),
|
|
data(){
|
|
return {
|
|
chart: null,
|
|
}
|
|
},
|
|
props: {
|
|
constructorType: {
|
|
type: String,
|
|
default: 'chart'
|
|
},
|
|
options: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
callback: Function,
|
|
updateArgs: {
|
|
type: Array,
|
|
default: () => [true, true]
|
|
},
|
|
highcharts: {
|
|
type: Object
|
|
},
|
|
deepCopyOnUpdate: {
|
|
type: Boolean,
|
|
default: true
|
|
}
|
|
},
|
|
watch: {
|
|
options: {
|
|
handler(newValue) {
|
|
if (this.chart) {
|
|
this.chart.update(
|
|
copyObject(newValue, this.deepCopyOnUpdate),
|
|
...this.updateArgs
|
|
);
|
|
}
|
|
},
|
|
deep: true
|
|
}
|
|
},
|
|
mounted() {
|
|
debugger;
|
|
const HC = this.highcharts || Highcharts;
|
|
|
|
if (!HC[this.constructorType]) {
|
|
console.error(`'${this.constructorType}' constructor-type is incorrect. Sometimes this error is caused by the fact, that the corresponding module wasn't imported.`);
|
|
return;
|
|
}
|
|
|
|
if (!this.options) {
|
|
console.error('The "options" parameter was not passed.');
|
|
return;
|
|
}
|
|
|
|
this.chart = HC[this.constructorType](
|
|
this.$refs.chart,
|
|
copyObject(this.options, true), // Always pass the deep copy when generating a chart. #80
|
|
this.callback ? this.callback : null
|
|
);
|
|
}
|
|
};
|
|
|
|
</script>
|
|
|