<template>
<view>
<view :prop="echartInfo" :change:prop="" :class="" style="width: 100%;height: 100%">
<div :id="" :style="{width:screenWidth,height:height}"></div>
</view>
</view>
</template>
<script>
export default {
props: {
echartInfo: {
type: Object,
default: () => {}
}
}
}
</script>
<script module="echarts">
//let myChart
export default {
myChart:null,
data(){
return{
screenWidth:'',
height:'200px'
}
},
mounted() {
= +'px';
if (typeof === 'function') {
()
} else {
// 动态引入较大类库避免影响页面展示
const script = ('script')
// view 层的页面运行在 www 根目录，其相对路径相对于 www 计算
= 'static/'
= (this)
(script)
}
},
methods: {
initEcharts() {
let option =
let id = ;
= ((id))
// 观测更新的数据在 view 层可以直接访问到
(option)
();
},
updateEcharts(newValue, oldValue, ownerInstance, instance) {
// 监听 service 层数据变更
(newValue)
();
}
}
}
</script>
<style>
.content {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
#echart_2{
height: 400rpx !important;
margin-left: -20rpx;
}
#echart3{
height: 500rpx !important;
}
#echart4{
height: 500rpx !important;
}
#echart6{
height: 500rpx !important;
}
</style>