| | |
| | | |
| | | <script> |
| | | import * as echarts from "echarts" |
| | | import { countCountryDimension, countProvinceDimension } from "@/api/screen.js" |
| | | import { |
| | | countCountryDimension, |
| | | countProvinceDimension, |
| | | countProjectStorage, |
| | | } from "@/api/screen.js" |
| | | export default { |
| | | props: { |
| | | width: { |
| | |
| | | type: String, |
| | | default: "全国项目", |
| | | }, |
| | | params: { |
| | | type: Object, |
| | | default: () => null, |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | |
| | | }, |
| | | computed: { |
| | | option() { |
| | | let echartData = [ |
| | | { |
| | | value: 2154, |
| | | name: "曲阜师范大学", |
| | | }, |
| | | { |
| | | value: 3854, |
| | | name: "潍坊学院", |
| | | }, |
| | | { |
| | | value: 3515, |
| | | name: "青岛职业技术学院", |
| | | }, |
| | | { |
| | | value: 3515, |
| | | name: "淄博师范高等专科", |
| | | }, |
| | | { |
| | | value: 3854, |
| | | name: "鲁东大学", |
| | | }, |
| | | { |
| | | value: 2154, |
| | | name: "山东师范大学", |
| | | }, |
| | | ] |
| | | let echartData = [] |
| | | let data = [] |
| | | let xAxisData = [] |
| | | let yAxisData = [] |
| | |
| | | if (this.dataList) { |
| | | data = this.dataList |
| | | echartData = data.map(item => { |
| | | let name = item.province || item.country |
| | | let name = item.province || item.country || item.name |
| | | // xAxisData.push(name) |
| | | // yAxisData.push(item.count) |
| | | count += item.count |
| | |
| | | "#18edc9", |
| | | "#6ac5fa", |
| | | ], |
| | | // minAngle: 15, |
| | | // startAngle: 270, |
| | | minAngle: 15, |
| | | startAngle: 270, |
| | | label: { |
| | | normal: { |
| | | formatter: function (params, ticket, callback) { |
| | |
| | | }, |
| | | labelLine: { |
| | | normal: { |
| | | length: 55 * scale, |
| | | length: 30, |
| | | length2: 0, |
| | | lineStyle: { |
| | | color: "#0b5263", |
| | |
| | | }, |
| | | project: { |
| | | deep: true, |
| | | immediate: true, |
| | | handler(newVal) { |
| | | let requsetFn = null |
| | | switch (newVal) { |
| | |
| | | case "全国项目": |
| | | requsetFn = countProvinceDimension |
| | | break |
| | | case "全球管网图": |
| | | requsetFn = countProvinceDimension |
| | | break |
| | | case "全国管网图": |
| | | requsetFn = countProvinceDimension |
| | | break |
| | | |
| | | default: |
| | | requsetFn = countProjectStorage |
| | | |
| | | break |
| | | } |
| | | requsetFn && this.initData(requsetFn) |
| | | |
| | | this.setOptions(this.option) |
| | | }, |
| | | }, |
| | | }, |
| | | created() { |
| | | // this.initData() |
| | | }, |
| | | mounted() { |
| | | this.initData() |
| | | this.initChart() |
| | | if (this.autoResize) { |
| | | window.addEventListener("resize", this.resizeHandler) |
| | |
| | | }, |
| | | methods: { |
| | | resizeHandler() { |
| | | this.chart.resize() |
| | | this.chart && this.chart.resize() |
| | | }, |
| | | initChart() { |
| | | this.chart = echarts.init(this.$refs.chart, "", { |
| | |
| | | if (this.chart) { |
| | | this.chart.setOption(option) |
| | | } |
| | | |
| | | }, |
| | | refresh() { |
| | | this.setOptions(this.option) |
| | |
| | | clearChart() { |
| | | this.chart && this.chart.clear() |
| | | }, |
| | | async initData(requsetFn = countCountryDimension) { |
| | | const res = await requsetFn() |
| | | async initData(requsetFn) { |
| | | const res = await requsetFn(this.params) |
| | | if (res.code == 200) { |
| | | this.dataList = res.result |
| | | console.log("requsetFn", res) |