feat:重庆市工程管理有限公司数字化提升项目 大屏

This commit is contained in:
xuyoubin 2024-01-10 17:31:04 +08:00
parent 2e17ddb4b6
commit 21a93086b6

View File

@ -513,242 +513,239 @@ export default {
}) })
); );
}, },
// initMiddleMap() { initMiddleMap() {
// echarts.registerMap("chongqing", jsData); echarts.registerMap("chongqing", jsData);
// const mainMap = document.getElementById("middleMap"); const mainMap = document.getElementById("middleMap");
// this.mainMapIns = echarts.init(mainMap); this.mainMapIns = echarts.init(mainMap);
// const dataList = [ const dataList = [
// { {
// location: [87.2305571, 42.952565], location: [87.2305571, 42.952565],
// name: "", name: "新疆维吾尔自治区",
// money: "10", money: "10",
// project: "10", project: "10",
// }, },
// { {
// location: [87.6720922, 30.4421226], location: [87.6720922, 30.4421226],
// name: "西", name: "西藏自治区",
// number: "115", number: "115",
// money: "15", money: "15",
// project: "18", project: "18",
// }, },
// { {
// location: [100.3294324, 37.073776], location: [100.3294324, 37.073776],
// name: "", name: "甘肃省",
// money: "12", money: "12",
// project: "15", project: "15",
// }, },
// { {
// location: [115.2680375, 42.6545234], location: [115.2680375, 42.6545234],
// name: "", name: "内蒙古自治区",
// money: "8", money: "8",
// project: "10", project: "10",
// }, },
// { {
// location: [117.6596861, 35.494953], location: [117.6596861, 35.494953],
// name: "", name: "山东省",
// money: "120", money: "120",
// project: "15", project: "15",
// }, },
// { {
// location: [101.6172432, 30.8557071], location: [101.6172432, 30.8557071],
// name: "", name: "四川省",
// money: "15", money: "15",
// project: "10", project: "10",
// }, },
// { {
// location: [109.5096669, 21.9042145], location: [109.5096669, 21.9042145],
// name: "广西", name: "广西壮族自治区",
// money: "25", money: "25",
// project: "15", project: "15",
// }, },
// { {
// location: [115.1760343, 25.8285884], location: [115.1760343, 25.8285884],
// name: "西", name: "江西省",
// money: "20", money: "20",
// project: "16", project: "16",
// }, },
// ]; ];
// this.mainMapIns.setOption( this.mainMapIns.setOption(
// { {
// baseOption: { baseOption: {
// geo: { geo: {
// aspectScale: 1, // aspectScale: 1, //
// map: "chongqing", map: "chongqing",
// roam: false, roam: false,
// itemStyle: { itemStyle: {
// borderColor: "#1877cd", borderColor: "#1877cd",
// borderWidth: 2, borderWidth: 2,
// areaColor: { areaColor: {
// type: "radial", type: "radial",
// x: 0.5, x: 0.5,
// y: 0.5, y: 0.5,
// r: 0.8, r: 0.8,
// colorStops: [ colorStops: [
// { {
// offset: 0, offset: 0,
// color: "#000000", // 0% // 0% color: "#000000", // 0% // 0%
// }, },
// { {
// offset: 1, offset: 1,
// color: "#514768", // 100% // 100% color: "#514768", // 100% // 100%
// }, },
// ], ],
// globalCoord: false, // false globalCoord: false, // false
// }, },
// shadowColor: "#0938b6", shadowColor: "#0938b6",
// shadowOffsetX: -10, shadowOffsetX: -10,
// shadowOffsetY: -10, shadowOffsetY: -10,
// shadowBlur: 19, shadowBlur: 19,
// emphasis: { emphasis: {
// areaColor: { areaColor: {
// type: "radial", type: "radial",
// x: 0.5, x: 0.5,
// y: 0.5, y: 0.5,
// r: 0.8, r: 0.8,
// colorStops: [ colorStops: [
// { {
// offset: 0, offset: 0,
// color: "#0335b5", // 0% // 0% color: "#0335b5", // 0% // 0%
// }, },
// { {
// offset: 1, offset: 1,
// color: "#fba509", // 100% // 100% color: "#fba509", // 100% // 100%
// }, },
// ], ],
// globalCoord: false, // false globalCoord: false, // false
// }, },
// borderWidth: 2, borderWidth: 2,
// borderColor: "#7e95d2", borderColor: "#7e95d2",
// }, },
// }, },
// }, },
// tooltip: { tooltip: {
// show: true, show: true,
// className: "tooltip-frame", className: "tooltip-frame",
// }, },
// series: [ series: [
// // //
// { {
// type: "scatter", type: "scatter",
// coordinateSystem: "geo", coordinateSystem: "geo",
// tooltip: { tooltip: {
// backgroundColor: '#000', backgroundColor: '#000',
// formatter: (val) => { formatter: (val) => {
// const { data } = val; const { data } = val;
// const { INFO } = data; const { INFO } = data;
// return `<div style=" return `<div style="
// background:#5b9ad4; background:#5b9ad4;
// display:flex; display:flex;
// align-items:center; align-items:center;
// flex-direction: column; flex-direction: column;
// justify-content: space-around;color:#fff;width:150px;height:0px"> justify-content: space-around;color:#fff;width:150px;height:0px">
// <div style="width:100%,text-align:center;">${data.name}</div> <div style="width:100%,text-align:center;">${data.name}</div>
// <div style="display: flex; justify-content: space-around; align-items:center;width:100%;"> <div style="display: flex; justify-content: space-around; align-items:center;width:100%;">
// <div></div> <div>客户数量</div>
// <div>${data.project}</div> <div>${data.project}</div>
// </div> </div>
// <div style="display: flex; justify-content: space-around; align-items:center;width:100%;"> <div style="display: flex; justify-content: space-around; align-items:center;width:100%;">
// <div></div> <div>合同金额</div>
// <div>${data.money}亿</div> <div>${data.money}亿</div>
// </div> </div>
// </div>`; </div>`;
// }, },
// }, },
// symbol: "image://" + NotImg, symbol: "image://" + NotImg,
// symbolSize: [20, 20], symbolSize: [20, 20],
// symbolOffset: [0, -25], symbolOffset: [0, -25],
// radius: "50%", radius: "50%",
// data: dataList.map((item) => { data: dataList.map((item) => {
// const INFO = {}; const INFO = {};
// for (let key in item) { for (let key in item) {
// INFO[key] = item[key]; INFO[key] = item[key];
// } }
// return { return {
// value: item.location, value: item.location,
// name: item.name, name: item.name,
// money: item.money, money: item.money,
// project: item.project, project: item.project,
// number: item.number, number: item.number,
// }; };
// }), }),
// }, },
// { {
// show: false, show: false,
// type: "map", type: "map",
// map: "chongqing", map: "chongqing",
// zoom: 1, zoom: 1,
// aspectScale: 1, aspectScale: 1,
// itemStyle: { itemStyle: {
// borderColor: "#05d6f8", borderColor: "#05d6f8",
// borderWidth: 2, borderWidth: 2,
// areaColor: { areaColor: {
// type: "radial", type: "radial",
// x: 0.5, x: 0.5,
// y: 0.5, y: 0.5,
// r: 0.8, r: 0.8,
// colorStops: [ colorStops: [
// { {
// offset: 0, offset: 0,
// color: "#012188", // 0% // 0% color: "#012188", // 0% // 0%
// }, },
// { {
// offset: 1, offset: 1,
// color: "#0335b5", // 100% // 100% color: "#0335b5", // 100% // 100%
// }, },
// ], ],
// globalCoord: false, // false globalCoord: false, // false
// }, },
// shadowColor: "#0938b6", shadowColor: "#0938b6",
// shadowOffsetX: -10, shadowOffsetX: -10,
// shadowOffsetY: -10, shadowOffsetY: -10,
// shadowBlur: 19, shadowBlur: 19,
// emphasis: { emphasis: {
// areaColor: { areaColor: {
// type: "radial", type: "radial",
// x: 0.5, x: 0.5,
// y: 0.5, y: 0.5,
// r: 0.8, r: 0.8,
// colorStops: [ colorStops: [
// { {
// offset: 0, offset: 0,
// color: "#0335b5", // 0% // 0% color: "#0335b5", // 0% // 0%
// }, },
// { {
// offset: 1, offset: 1,
// color: "#fba509", // 100% // 100% color: "#fba509", // 100% // 100%
// }, },
// ], ],
// globalCoord: false, // false globalCoord: false, // false
// }, },
// borderWidth: 2, borderWidth: 2,
// borderColor: "#fda809", borderColor: "#fda809",
// }, },
// }, },
// label: { label: {
// show: true, show: true,
// color: "#ffffffA0", color: "#ffffffA0",
// fontWeight: "500", fontWeight: "500",
// fontSize: "10", fontSize: "10",
// emphasis: { emphasis: {
// color: "#ffffff", color: "#ffffff",
// }, },
// }, },
// tooltip: { tooltip: {
// show: false, show: false,
// }, },
// }, },
// ], ],
// }, },
// }, },
// true true
// ); );
// window.addEventListener("resize", () => { window.addEventListener("resize", () => {
// this.mainMapIns && this.mainMapIns.resize(); this.mainMapIns && this.mainMapIns.resize();
// }); });
// }, },
initMiddleMap(){
}
}, },
}; };
</script> </script>