|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="W-full pr30 pl30 pt30">
|
|
|
- <canvas width="500" height="500" id="fuzhou"></canvas>
|
|
|
+ <canvas width="500" height="400" id="fuzhou"></canvas>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -8,15 +8,16 @@
|
|
|
import { defineComponent, onMounted } from "vue";
|
|
|
import api from '@/api'
|
|
|
import router from "@/router";
|
|
|
-import fuzhouJson from '@/assets/json/福州市.json'
|
|
|
+import fuzhouJson from '@/assets/json/福州市v2.json'
|
|
|
import echarts from 'echarts'
|
|
|
+// import echarts from 'echarts'
|
|
|
const logOut = () => {
|
|
|
api.login.logout().then(res => {
|
|
|
router.push('/login')
|
|
|
})
|
|
|
}
|
|
|
const renderMap = () => {
|
|
|
-echarts.registerMap("fz",fuzhouJson as any)
|
|
|
+echarts.registerMap("fz",fuzhouJson)
|
|
|
let Chart = echarts.init(document.getElementById("fuzhou"));
|
|
|
// 颜色或文字的配置
|
|
|
let option = {
|
|
|
@@ -24,7 +25,8 @@ echarts.registerMap("fz",fuzhouJson as any)
|
|
|
type: "map",
|
|
|
aspectScale: 1, // 横向拉伸
|
|
|
// roam: true, // 地图操作 开启缩放或者平移，可以设置成 'scale' 或者 'move'。
|
|
|
- map: "SC",
|
|
|
+ map: "fz",
|
|
|
+ nameMap:'福州地图',
|
|
|
label: {
|
|
|
show: true,
|
|
|
normal: {
|
|
|
@@ -40,13 +42,13 @@ echarts.registerMap("fz",fuzhouJson as any)
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
- areaColor: "#040c3c", //地图本身的颜色
|
|
|
+ areaColor: "#efefef", //地图本身的颜色
|
|
|
borderColor: "#00feda", //省份边框颜色
|
|
|
borderWidth: 1, // 省份边框宽度
|
|
|
opacity: 1, //图形透明度
|
|
|
},
|
|
|
emphasis: {
|
|
|
- areaColor: "#040c3c", // 高亮时候地图显示的颜色
|
|
|
+ areaColor: "#ff4400", // 高亮时候地图显示的颜色
|
|
|
borderWidth: 0, // 高亮时的边框宽度
|
|
|
},
|
|
|
},
|
|
|
@@ -70,7 +72,7 @@ echarts.registerMap("fz",fuzhouJson as any)
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
shadowBlur: 10,
|
|
|
- color: "#00ECC8",
|
|
|
+ color: "#ff4400",
|
|
|
},
|
|
|
emphasis: {
|
|
|
borderColor: "#fff",
|
