Commit 6d35d9c3 authored by chris.yang's avatar chris.yang

feat:折柱图

parent 48812baa
<template>
<view>
<uni-ec-canvas class="uni-ec-canvas" id="line-chart" ref="canvas" canvas-id="lazy-load-chart" :ec="ec">
</uni-ec-canvas>
</view>
</template>
<script>
import uniEcCanvas from '@/components/uni-ec-canvas/uni-ec-canvas'
import * as echarts from '@/components/uni-ec-canvas/echarts'
import echartElementData from '@/mixins/echartElementData.js'
let chart = null
export default {
name: "LineMixBar",
mixins: [echartElementData],
data() {
return {
ec: {
lazyLoad: true
}
}
},
onReady() {
},
components: {
uniEcCanvas
},
methods: {
initChart() {
this.$nextTick(() => {
this.$refs['canvas'].init((canvas, width, height, canvasDpr) => {
chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: canvasDpr
})
canvas.setChart(chart)
const {
dataList: {
categories,
series
}
} = this.elementData
const options = {
...this.elementInfo.option,
tooltip: {},
xAxis: {
...this.elementInfo.option.xAxis,
data: categories
},
yAxis: [{
...this.elementInfo.option.yAxis,
type: 'value'
},
{
...this.elementInfo.option.yAxis,
type: 'value'
}
],
series: this.dealSeriesData(series)
}
chart.setOption(options)
return chart
})
})
},
/**
* 处理数据
*/
dealSeriesData(data) {
debugger
if (!data) return
const newData = data.map(item => {
let config = {
label: {
...this.elementInfo.option.dataset,
formatter: val => {
return converFunction(this.elementInfo.option.dataset.formatter, val)
}
}
}
if (item.type === 'bar') {
config = {
...config,
...this.elementInfo.option.bar
}
} else if (item.type === 'line') {
config = {
yAxisIndex: 1,
...config,
...this.elementInfo.option.line
}
}
return {
...item,
...config
}
})
return newData
}
}
}
</script>
<style scoped>
.uni-ec-canvas {
width: 750rpx;
height: 750rpx;
display: block;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment