533bc4f9e7
Former-commit-id: f6a5fca09b86f3a96cb9fa66ff4b52fc3500fc72 Former-commit-id: eca145feeaa4bbef48a4a6e6a1bc7fbe999a1c8b Former-commit-id: 231af91d28697142824bde9c2fc2e49c5f84eed2
44 lines
852 B
Vue
44 lines
852 B
Vue
<template>
|
|
<div ref="chart" style="height: 100%;"></div>
|
|
</template>
|
|
|
|
<script>
|
|
import G2Mixin from './G2'
|
|
export default {
|
|
mixins: [
|
|
G2Mixin
|
|
],
|
|
data () {
|
|
return {
|
|
// 在组件 mounted 后立即初始化图表
|
|
mountedInit: false
|
|
}
|
|
},
|
|
methods: {
|
|
// 初始化图表
|
|
initHandler () {
|
|
this.creatChart()
|
|
this.setChartTitle()
|
|
this.chart.source(this.data)
|
|
this.chart.scale('value', {
|
|
min: 0
|
|
})
|
|
this.chart.scale('year', {
|
|
range: [0, 1]
|
|
})
|
|
this.chart.tooltip({
|
|
crosshairs: {
|
|
type: 'line'
|
|
}
|
|
})
|
|
this.chart.line().position('year*value')
|
|
this.chart.point().position('year*value').size(4).shape('circle').style({
|
|
stroke: '#fff',
|
|
lineWidth: 1
|
|
})
|
|
this.chart.render()
|
|
}
|
|
}
|
|
}
|
|
</script>
|