| | |
| | | <template> |
| | | <div :class="className" :style="{ height: height, width: width }" /> |
| | | <div |
| | | :class="className" |
| | | :style="{ height: height, width: width }" |
| | | /> |
| | | </template> |
| | | |
| | | <script> |
| | |
| | | default: () => [] |
| | | } |
| | | }, |
| | | data() { |
| | | data () { |
| | | return { |
| | | chart: null, |
| | | seriesData: [] |
| | |
| | | }, |
| | | watch: { |
| | | 'chartData': { |
| | | handler(newVal) { |
| | | handler (newVal) { |
| | | console.log('newVal', newVal) |
| | | this.seriesData = [] |
| | | this.seriesData = newVal |
| | |
| | | immediate: true |
| | | } |
| | | }, |
| | | mounted() { |
| | | mounted () { |
| | | this.$nextTick(() => { |
| | | this.initChart() |
| | | }) |
| | | }, |
| | | beforeDestroy() { |
| | | beforeDestroy () { |
| | | if (!this.chart) { |
| | | return |
| | | } |
| | |
| | | this.chart = null |
| | | }, |
| | | methods: { |
| | | initChart() { |
| | | initChart () { |
| | | this.chart = echarts.init(this.$el, 'macarons') |
| | | this.chart.clear() |
| | | this.setOptions() |
| | | }, |
| | | setOptions() { |
| | | setOptions () { |
| | | // function fontSize(res) { |
| | | // let clientWidth = |
| | | // window.innerWidth || |
| | |
| | | fontSize: 16 |
| | | }, |
| | | value: { |
| | | width: 20, |
| | | width: 100, |
| | | align: 'right', |
| | | fontFamily: 'Medium', |
| | | fontSize: 16 |
| | |
| | | } |
| | | } |
| | | </script> |
| | | |