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.
71 lines
1.7 KiB
71 lines
1.7 KiB
<!--
|
|
* @Author: your name
|
|
* @Date: 2021-10-13 16:54:12
|
|
* @LastEditTime: 2021-11-08 13:31:01
|
|
* @LastEditors: Please set LastEditors
|
|
* @Description: In User Settings Edit
|
|
* @FilePath: /data-show/src/views/TailInsightDetails/mediaDistribution/index.vue
|
|
-->
|
|
<template>
|
|
<div class="md-outter">
|
|
<v-label-div title="媒体分布"></v-label-div>
|
|
<div class="md-inner">
|
|
<v-echarts :opt="opt" @echarsUpdate="echarsFun"></v-echarts>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import createOpt from "./opt";
|
|
export default {
|
|
name: "MTDmediaDistribution",
|
|
data() {
|
|
return {
|
|
opt: createOpt(),
|
|
};
|
|
},
|
|
methods: {
|
|
echarsFun(myChart) {
|
|
let index = 0;
|
|
myChart.dispatchAction({
|
|
type: "highlight",
|
|
seriesIndex: 0,
|
|
dataIndex: 0,
|
|
});
|
|
myChart.on("mouseover", function (e) {
|
|
if (e.dataIndex != index) {
|
|
myChart.dispatchAction({
|
|
type: "downplay",
|
|
seriesIndex: 0,
|
|
dataIndex: index,
|
|
});
|
|
}
|
|
});
|
|
|
|
myChart.on("mouseout", function (e) {
|
|
index = e.dataIndex;
|
|
|
|
myChart.dispatchAction({
|
|
type: "highlight",
|
|
seriesIndex: 0,
|
|
dataIndex: e.dataIndex,
|
|
});
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.md-outter {
|
|
width: 460px;
|
|
height: 460px;
|
|
border: 2px solid #0f2a4d;
|
|
margin-left: 16px;
|
|
.md-inner {
|
|
width: 100%;
|
|
height: calc(100% - 48px);
|
|
}
|
|
}
|
|
</style>
|