添加mixins功能,修改图标引入方式
This commit is contained in:
@@ -5,20 +5,22 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echartMixins from "@/utils/resizeMixins";
|
||||
const echarts = require("echarts");
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
mixins: [echartMixins],
|
||||
mounted() {
|
||||
this.drawPie();
|
||||
this.draw();
|
||||
},
|
||||
methods: {
|
||||
drawPie() {
|
||||
draw() {
|
||||
// 基于准备好的dom,初始化echarts实例
|
||||
let myChartPieLeft = echarts.init(
|
||||
document.getElementById("bottomLeftChart")
|
||||
);
|
||||
this.chart = echarts.init(document.getElementById("bottomLeftChart"));
|
||||
// ----------------------------------------------------------------
|
||||
let category = [
|
||||
"市区",
|
||||
@@ -255,10 +257,7 @@ export default {
|
||||
}
|
||||
]
|
||||
};
|
||||
myChartPieLeft.setOption(option);
|
||||
// -----------------------------------------------------------------
|
||||
// 响应式变化
|
||||
window.addEventListener("resize", () => myChartPieLeft.resize(), false);
|
||||
this.chart.setOption(option);
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
@@ -5,26 +5,28 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echartMixins from "@/utils/resizeMixins";
|
||||
const echarts = require("echarts");
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.drawPie();
|
||||
this.draw();
|
||||
this.charTimg();
|
||||
},
|
||||
mixins: [echartMixins],
|
||||
methods: {
|
||||
charTimg() {
|
||||
setInterval(() => {
|
||||
this.drawPie();
|
||||
this.draw();
|
||||
}, 6000);
|
||||
},
|
||||
drawPie() {
|
||||
draw() {
|
||||
// 基于准备好的dom,初始化echarts实例
|
||||
let myChartPieLeft = echarts.init(
|
||||
document.getElementById("bottomRightChart")
|
||||
);
|
||||
this.chart = echarts.init(document.getElementById("bottomRightChart"));
|
||||
// ----------------------------------------------------------------
|
||||
// 数据
|
||||
let dateBase = new Date();
|
||||
@@ -392,10 +394,7 @@ export default {
|
||||
]
|
||||
};
|
||||
|
||||
myChartPieLeft.setOption(option);
|
||||
// -----------------------------------------------------------------
|
||||
// 响应式变化
|
||||
window.addEventListener("resize", () => myChartPieLeft.resize(), false);
|
||||
this.chart.setOption(option);
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
@@ -5,13 +5,17 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echartMixins from "@/utils/resizeMixins";
|
||||
const echarts = require("echarts");
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
mixins: [echartMixins],
|
||||
mounted() {
|
||||
this.drawPie();
|
||||
this.draw();
|
||||
},
|
||||
props: {
|
||||
id: {
|
||||
@@ -41,9 +45,9 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
drawPie() {
|
||||
draw() {
|
||||
// 基于准备好的dom,初始化echarts实例
|
||||
let myChartPieLeft = echarts.init(document.getElementById(this.id));
|
||||
this.chart = echarts.init(document.getElementById(this.id));
|
||||
// ----------------------------------------------------------------
|
||||
let tips = this.tips;
|
||||
let option = {
|
||||
@@ -88,10 +92,7 @@ export default {
|
||||
}
|
||||
]
|
||||
};
|
||||
myChartPieLeft.setOption(option);
|
||||
// -----------------------------------------------------------------
|
||||
// 响应式变化
|
||||
window.addEventListener("resize", () => myChartPieLeft.resize(), false);
|
||||
this.chart.setOption(option);
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
@@ -5,23 +5,25 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echartMixins from "@/utils/resizeMixins";
|
||||
const echarts = require("echarts");
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
mixins: [echartMixins],
|
||||
mounted() {
|
||||
this.drawPie();
|
||||
this.draw();
|
||||
},
|
||||
methods: {
|
||||
drawPie(sidebar) {
|
||||
draw() {
|
||||
// 基于准备好的dom,初始化echarts实例
|
||||
let myChartPieLeft = echarts.init(
|
||||
document.getElementById("centreLeft1Chart")
|
||||
);
|
||||
this.chart = echarts.init(document.getElementById("centreLeft1Chart"));
|
||||
// ----------------------------------------------------------------
|
||||
|
||||
myChartPieLeft.setOption({
|
||||
this.chart.setOption({
|
||||
color: [
|
||||
"#37a2da",
|
||||
"#32c5e9",
|
||||
@@ -68,13 +70,6 @@ export default {
|
||||
}
|
||||
]
|
||||
});
|
||||
// -----------------------------------------------------------------
|
||||
// 响应式变化
|
||||
window.addEventListener("resize", () => myChartPieLeft.resize(), false);
|
||||
//侧边栏变化
|
||||
if (sidebar) {
|
||||
myChartPieLeft.resize();
|
||||
}
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
@@ -5,20 +5,22 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echartMixins from "@/utils/resizeMixins";
|
||||
const echarts = require("echarts");
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
mixins: [echartMixins],
|
||||
mounted() {
|
||||
this.drawPie();
|
||||
this.draw();
|
||||
},
|
||||
methods: {
|
||||
drawPie(sidebar) {
|
||||
draw() {
|
||||
// 基于准备好的dom,初始化echarts实例
|
||||
let myChartPieLeft = echarts.init(
|
||||
document.getElementById("centreLeft2Chart")
|
||||
);
|
||||
this.chart = echarts.init(document.getElementById("centreLeft2Chart"));
|
||||
// ----------------------------------------------------------------
|
||||
|
||||
let option = {
|
||||
@@ -188,14 +190,7 @@ export default {
|
||||
}
|
||||
]
|
||||
};
|
||||
myChartPieLeft.setOption(option);
|
||||
// -----------------------------------------------------------------
|
||||
// 响应式变化
|
||||
window.addEventListener("resize", () => myChartPieLeft.resize(), false);
|
||||
//侧边栏变化
|
||||
if (sidebar) {
|
||||
myChartPieLeft.resize();
|
||||
}
|
||||
this.chart.setOption(option);
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
@@ -5,24 +5,24 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echartMixins from "@/utils/resizeMixins";
|
||||
const echarts = require("echarts");
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
mixins: [echartMixins],
|
||||
mounted() {
|
||||
this.drawPie();
|
||||
this.draw();
|
||||
},
|
||||
methods: {
|
||||
drawPie(sidebar) {
|
||||
draw() {
|
||||
// 基于准备好的dom,初始化echarts实例
|
||||
let myChartPieLeft = echarts.init(
|
||||
document.getElementById("centreRight2Chart1")
|
||||
);
|
||||
this.chart = echarts.init(document.getElementById("centreRight2Chart1"));
|
||||
// ----------------------------------------------------------------
|
||||
// Schema:
|
||||
// date,AQIindex,PM2.5,PM10,CO,NO2,SO2
|
||||
var dataBJ = [
|
||||
let dataBJ = [
|
||||
[94, 69, 114, 2.08, 73, 39, 22],
|
||||
[99, 73, 110, 2.43, 76, 48, 23],
|
||||
[31, 12, 30, 0.5, 32, 16, 24],
|
||||
@@ -32,7 +32,7 @@ export default {
|
||||
[160, 120, 186, 2.77, 91, 50, 28]
|
||||
];
|
||||
|
||||
var dataGZ = [
|
||||
let dataGZ = [
|
||||
[84, 94, 140, 2.238, 68, 18, 22],
|
||||
[93, 77, 104, 1.165, 53, 7, 23],
|
||||
[99, 130, 227, 3.97, 55, 15, 24],
|
||||
@@ -42,7 +42,7 @@ export default {
|
||||
[56, 48, 68, 1.336, 37, 9, 28]
|
||||
];
|
||||
|
||||
var dataSH = [
|
||||
let dataSH = [
|
||||
[91, 45, 125, 0.82, 34, 23, 1],
|
||||
[65, 27, 78, 0.86, 45, 29, 2],
|
||||
[83, 60, 84, 1.09, 73, 27, 3],
|
||||
@@ -52,7 +52,7 @@ export default {
|
||||
[106, 77, 114, 1.07, 55, 51, 7]
|
||||
];
|
||||
|
||||
var lineStyle = {
|
||||
let lineStyle = {
|
||||
normal: {
|
||||
width: 1,
|
||||
opacity: 0.5
|
||||
@@ -151,14 +151,7 @@ export default {
|
||||
}
|
||||
]
|
||||
};
|
||||
myChartPieLeft.setOption(option);
|
||||
// -----------------------------------------------------------------
|
||||
// 响应式变化
|
||||
window.addEventListener("resize", () => myChartPieLeft.resize(), false);
|
||||
//侧边栏变化
|
||||
if (sidebar) {
|
||||
myChartPieLeft.resize();
|
||||
}
|
||||
this.chart.setOption(option);
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
|
||||
Reference in New Issue
Block a user