diff --git a/public/img/icon3.png b/public/img/icon3.png new file mode 100644 index 0000000..61c12c1 --- /dev/null +++ b/public/img/icon3.png Binary files differ diff --git a/public/img/icon3.png b/public/img/icon3.png new file mode 100644 index 0000000..61c12c1 --- /dev/null +++ b/public/img/icon3.png Binary files differ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index b17a9b9..62e9a5a 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -49,6 +49,22 @@ console.log('当前点击坐标为: ', location) } } +// 地图实例对象 +const AMap1 = ref() +// 图层实例 +const layer = ref() +const flag = ref(true) +// 切换图层 +const changeLayerGrop = () => { + if (flag.value) { + map.value.addLayer(layer.value) + } + else { + map.value.removeLayer(layer.value) + } + flag.value = !flag.value +} +defineExpose({ changeLayerGrop, flag }) // 初始化地图 const initMap = () => { AMapLoader.load({ @@ -57,14 +73,18 @@ plugins: ['AMap.Scale', 'AMap.MouseTool', 'AMap.ToolBar'], // 需要使用的的插件列表,如比例尺'AMap.Scale'等 }) .then((AMap) => { + AMap1.value = AMap // 初始化地图 map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 // center: markerArr.value[0], - center: [111.765543, 40.717444], + center: [111.765785, 40.718114], + // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) + // 图层实例 + layer.value = new AMap.TileLayer.Satellite() // 绑定右击时间 map.value.on('mousedown', clickHandler) // 用来画区域的 @@ -229,10 +249,34 @@ zooms: [16, 20], }) + if (child[2] === 0) { + const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] + const icon = new AMap.Icon({ + size: new AMap.Size(36, 36), // 图标尺寸 + image: `${publicPath}img/icon3.png`, // Icon的图像 + imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 + imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量,适于雪碧图等 + }) + // const content = '
111
' + const marker = new AMap.Marker({ + zooms: [16, 20], + position: data, // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] + map: map.value, + icon, + offset: new AMap.Pixel(-20, -20), + }) + map.value.add([marker]) + } polyline.setMap(map.value) map.value.add(polyline) }) }) + // 离线支路连接添加开关图标 + // const online = path.map(item => ( + // item.map((child) => { + // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) + // }) + // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/public/img/icon3.png b/public/img/icon3.png new file mode 100644 index 0000000..61c12c1 --- /dev/null +++ b/public/img/icon3.png Binary files differ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index b17a9b9..62e9a5a 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -49,6 +49,22 @@ console.log('当前点击坐标为: ', location) } } +// 地图实例对象 +const AMap1 = ref() +// 图层实例 +const layer = ref() +const flag = ref(true) +// 切换图层 +const changeLayerGrop = () => { + if (flag.value) { + map.value.addLayer(layer.value) + } + else { + map.value.removeLayer(layer.value) + } + flag.value = !flag.value +} +defineExpose({ changeLayerGrop, flag }) // 初始化地图 const initMap = () => { AMapLoader.load({ @@ -57,14 +73,18 @@ plugins: ['AMap.Scale', 'AMap.MouseTool', 'AMap.ToolBar'], // 需要使用的的插件列表,如比例尺'AMap.Scale'等 }) .then((AMap) => { + AMap1.value = AMap // 初始化地图 map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 // center: markerArr.value[0], - center: [111.765543, 40.717444], + center: [111.765785, 40.718114], + // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) + // 图层实例 + layer.value = new AMap.TileLayer.Satellite() // 绑定右击时间 map.value.on('mousedown', clickHandler) // 用来画区域的 @@ -229,10 +249,34 @@ zooms: [16, 20], }) + if (child[2] === 0) { + const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] + const icon = new AMap.Icon({ + size: new AMap.Size(36, 36), // 图标尺寸 + image: `${publicPath}img/icon3.png`, // Icon的图像 + imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 + imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量,适于雪碧图等 + }) + // const content = '
111
' + const marker = new AMap.Marker({ + zooms: [16, 20], + position: data, // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] + map: map.value, + icon, + offset: new AMap.Pixel(-20, -20), + }) + map.value.add([marker]) + } polyline.setMap(map.value) map.value.add(polyline) }) }) + // 离线支路连接添加开关图标 + // const online = path.map(item => ( + // item.map((child) => { + // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) + // }) + // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/carbonCount.ts b/src/router/modules/carbonCount.ts index 37807a0..c1edcd1 100644 --- a/src/router/modules/carbonCount.ts +++ b/src/router/modules/carbonCount.ts @@ -38,18 +38,18 @@ activeMenu: '/carbonCount', }, }, - // { - // path: 'electricresult', - // name: 'electricresult', - // component: () => import('@/views/count/components/result.vue'), - // meta: { - // title: '电力碳核算', - // auth: '/count/electric', - // sidebar: false, - // breadcrumb: true, - // activeMenu: '/carbonCount', - // }, - // }, + { + path: 'electricresult', + name: 'electricresult', + component: () => import('@/views/count/components/result.vue'), + meta: { + title: '核算结果', + auth: '/count', + sidebar: false, + breadcrumb: true, + activeMenu: '/carbonCount', + }, + }, // { // path: 'heatingcount', // name: 'Heatingcount', diff --git a/public/img/icon3.png b/public/img/icon3.png new file mode 100644 index 0000000..61c12c1 --- /dev/null +++ b/public/img/icon3.png Binary files differ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index b17a9b9..62e9a5a 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -49,6 +49,22 @@ console.log('当前点击坐标为: ', location) } } +// 地图实例对象 +const AMap1 = ref() +// 图层实例 +const layer = ref() +const flag = ref(true) +// 切换图层 +const changeLayerGrop = () => { + if (flag.value) { + map.value.addLayer(layer.value) + } + else { + map.value.removeLayer(layer.value) + } + flag.value = !flag.value +} +defineExpose({ changeLayerGrop, flag }) // 初始化地图 const initMap = () => { AMapLoader.load({ @@ -57,14 +73,18 @@ plugins: ['AMap.Scale', 'AMap.MouseTool', 'AMap.ToolBar'], // 需要使用的的插件列表,如比例尺'AMap.Scale'等 }) .then((AMap) => { + AMap1.value = AMap // 初始化地图 map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 // center: markerArr.value[0], - center: [111.765543, 40.717444], + center: [111.765785, 40.718114], + // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) + // 图层实例 + layer.value = new AMap.TileLayer.Satellite() // 绑定右击时间 map.value.on('mousedown', clickHandler) // 用来画区域的 @@ -229,10 +249,34 @@ zooms: [16, 20], }) + if (child[2] === 0) { + const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] + const icon = new AMap.Icon({ + size: new AMap.Size(36, 36), // 图标尺寸 + image: `${publicPath}img/icon3.png`, // Icon的图像 + imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 + imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量,适于雪碧图等 + }) + // const content = '
111
' + const marker = new AMap.Marker({ + zooms: [16, 20], + position: data, // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] + map: map.value, + icon, + offset: new AMap.Pixel(-20, -20), + }) + map.value.add([marker]) + } polyline.setMap(map.value) map.value.add(polyline) }) }) + // 离线支路连接添加开关图标 + // const online = path.map(item => ( + // item.map((child) => { + // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) + // }) + // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/carbonCount.ts b/src/router/modules/carbonCount.ts index 37807a0..c1edcd1 100644 --- a/src/router/modules/carbonCount.ts +++ b/src/router/modules/carbonCount.ts @@ -38,18 +38,18 @@ activeMenu: '/carbonCount', }, }, - // { - // path: 'electricresult', - // name: 'electricresult', - // component: () => import('@/views/count/components/result.vue'), - // meta: { - // title: '电力碳核算', - // auth: '/count/electric', - // sidebar: false, - // breadcrumb: true, - // activeMenu: '/carbonCount', - // }, - // }, + { + path: 'electricresult', + name: 'electricresult', + component: () => import('@/views/count/components/result.vue'), + meta: { + title: '核算结果', + auth: '/count', + sidebar: false, + breadcrumb: true, + activeMenu: '/carbonCount', + }, + }, // { // path: 'heatingcount', // name: 'Heatingcount', diff --git a/src/utils/fullScreenUrl.ts b/src/utils/fullScreenUrl.ts index dc993d4..1b6414d 100644 --- a/src/utils/fullScreenUrl.ts +++ b/src/utils/fullScreenUrl.ts @@ -3,15 +3,15 @@ return [ { name: '碳足迹监测', - url: 'https://share.shanhaibi.com/645b6b3674e29/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, { name: '碳足迹评价', - url: 'https://share.shanhaibi.com/645b6ba377610/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, { name: '碳足迹预警', - url: 'https://share.shanhaibi.com/645b6c6749576/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, ] } diff --git a/public/img/icon3.png b/public/img/icon3.png new file mode 100644 index 0000000..61c12c1 --- /dev/null +++ b/public/img/icon3.png Binary files differ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index b17a9b9..62e9a5a 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -49,6 +49,22 @@ console.log('当前点击坐标为: ', location) } } +// 地图实例对象 +const AMap1 = ref() +// 图层实例 +const layer = ref() +const flag = ref(true) +// 切换图层 +const changeLayerGrop = () => { + if (flag.value) { + map.value.addLayer(layer.value) + } + else { + map.value.removeLayer(layer.value) + } + flag.value = !flag.value +} +defineExpose({ changeLayerGrop, flag }) // 初始化地图 const initMap = () => { AMapLoader.load({ @@ -57,14 +73,18 @@ plugins: ['AMap.Scale', 'AMap.MouseTool', 'AMap.ToolBar'], // 需要使用的的插件列表,如比例尺'AMap.Scale'等 }) .then((AMap) => { + AMap1.value = AMap // 初始化地图 map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 // center: markerArr.value[0], - center: [111.765543, 40.717444], + center: [111.765785, 40.718114], + // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) + // 图层实例 + layer.value = new AMap.TileLayer.Satellite() // 绑定右击时间 map.value.on('mousedown', clickHandler) // 用来画区域的 @@ -229,10 +249,34 @@ zooms: [16, 20], }) + if (child[2] === 0) { + const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] + const icon = new AMap.Icon({ + size: new AMap.Size(36, 36), // 图标尺寸 + image: `${publicPath}img/icon3.png`, // Icon的图像 + imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 + imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量,适于雪碧图等 + }) + // const content = '
111
' + const marker = new AMap.Marker({ + zooms: [16, 20], + position: data, // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] + map: map.value, + icon, + offset: new AMap.Pixel(-20, -20), + }) + map.value.add([marker]) + } polyline.setMap(map.value) map.value.add(polyline) }) }) + // 离线支路连接添加开关图标 + // const online = path.map(item => ( + // item.map((child) => { + // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) + // }) + // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/carbonCount.ts b/src/router/modules/carbonCount.ts index 37807a0..c1edcd1 100644 --- a/src/router/modules/carbonCount.ts +++ b/src/router/modules/carbonCount.ts @@ -38,18 +38,18 @@ activeMenu: '/carbonCount', }, }, - // { - // path: 'electricresult', - // name: 'electricresult', - // component: () => import('@/views/count/components/result.vue'), - // meta: { - // title: '电力碳核算', - // auth: '/count/electric', - // sidebar: false, - // breadcrumb: true, - // activeMenu: '/carbonCount', - // }, - // }, + { + path: 'electricresult', + name: 'electricresult', + component: () => import('@/views/count/components/result.vue'), + meta: { + title: '核算结果', + auth: '/count', + sidebar: false, + breadcrumb: true, + activeMenu: '/carbonCount', + }, + }, // { // path: 'heatingcount', // name: 'Heatingcount', diff --git a/src/utils/fullScreenUrl.ts b/src/utils/fullScreenUrl.ts index dc993d4..1b6414d 100644 --- a/src/utils/fullScreenUrl.ts +++ b/src/utils/fullScreenUrl.ts @@ -3,15 +3,15 @@ return [ { name: '碳足迹监测', - url: 'https://share.shanhaibi.com/645b6b3674e29/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, { name: '碳足迹评价', - url: 'https://share.shanhaibi.com/645b6ba377610/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, { name: '碳足迹预警', - url: 'https://share.shanhaibi.com/645b6c6749576/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, ] } diff --git a/src/views/count/components/result.vue b/src/views/count/components/result.vue index 28d63eb..241b163 100644 --- a/src/views/count/components/result.vue +++ b/src/views/count/components/result.vue @@ -2,7 +2,7 @@ import carbonAnalyse from './carbonAnalyse.vue' import carbonElement from './carbonElement.vue' import carbonGather from './carbonGather.vue' -const emit = defineEmits(['bak']) +const $router = useRouter() const carbonData = ref([]) onMounted(() => { carbonData.value = JSON.parse(sessionStorage.getItem('计算结果') as string) || [] @@ -64,11 +64,6 @@ @@ -170,15 +170,20 @@ background-image: url("../../../assets/images/result-bg.png"); } +// .container { +// position: relative; +// } + // .bak { // position: absolute; // top: 30px; // left: 10%; // } .bak-btn { - position: absolute; - left: 0; - top: 0; + position: fixed; + right: 7px; + top: 52px; + z-index: 99; } .content { @@ -188,6 +193,7 @@ min-height: 100vh; // margin-top: -85px; border-radius: 8px; + // background-image: url("../../../assets/images/result-bg.png") no-repeat; .echarts { display: flex; @@ -209,6 +215,7 @@ height: 8rem !important; // background-color: #ccc; padding: 1.5rem 3rem 4rem 2.5rem !important; + // padding: 0 !important; .logo { top: 1rem !important; diff --git a/public/img/icon3.png b/public/img/icon3.png new file mode 100644 index 0000000..61c12c1 --- /dev/null +++ b/public/img/icon3.png Binary files differ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index b17a9b9..62e9a5a 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -49,6 +49,22 @@ console.log('当前点击坐标为: ', location) } } +// 地图实例对象 +const AMap1 = ref() +// 图层实例 +const layer = ref() +const flag = ref(true) +// 切换图层 +const changeLayerGrop = () => { + if (flag.value) { + map.value.addLayer(layer.value) + } + else { + map.value.removeLayer(layer.value) + } + flag.value = !flag.value +} +defineExpose({ changeLayerGrop, flag }) // 初始化地图 const initMap = () => { AMapLoader.load({ @@ -57,14 +73,18 @@ plugins: ['AMap.Scale', 'AMap.MouseTool', 'AMap.ToolBar'], // 需要使用的的插件列表,如比例尺'AMap.Scale'等 }) .then((AMap) => { + AMap1.value = AMap // 初始化地图 map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 // center: markerArr.value[0], - center: [111.765543, 40.717444], + center: [111.765785, 40.718114], + // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) + // 图层实例 + layer.value = new AMap.TileLayer.Satellite() // 绑定右击时间 map.value.on('mousedown', clickHandler) // 用来画区域的 @@ -229,10 +249,34 @@ zooms: [16, 20], }) + if (child[2] === 0) { + const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] + const icon = new AMap.Icon({ + size: new AMap.Size(36, 36), // 图标尺寸 + image: `${publicPath}img/icon3.png`, // Icon的图像 + imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 + imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量,适于雪碧图等 + }) + // const content = '
111
' + const marker = new AMap.Marker({ + zooms: [16, 20], + position: data, // 经纬度对象,也可以是经纬度构成的一维数组[116.39, 39.9] + map: map.value, + icon, + offset: new AMap.Pixel(-20, -20), + }) + map.value.add([marker]) + } polyline.setMap(map.value) map.value.add(polyline) }) }) + // 离线支路连接添加开关图标 + // const online = path.map(item => ( + // item.map((child) => { + // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) + // }) + // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/carbonCount.ts b/src/router/modules/carbonCount.ts index 37807a0..c1edcd1 100644 --- a/src/router/modules/carbonCount.ts +++ b/src/router/modules/carbonCount.ts @@ -38,18 +38,18 @@ activeMenu: '/carbonCount', }, }, - // { - // path: 'electricresult', - // name: 'electricresult', - // component: () => import('@/views/count/components/result.vue'), - // meta: { - // title: '电力碳核算', - // auth: '/count/electric', - // sidebar: false, - // breadcrumb: true, - // activeMenu: '/carbonCount', - // }, - // }, + { + path: 'electricresult', + name: 'electricresult', + component: () => import('@/views/count/components/result.vue'), + meta: { + title: '核算结果', + auth: '/count', + sidebar: false, + breadcrumb: true, + activeMenu: '/carbonCount', + }, + }, // { // path: 'heatingcount', // name: 'Heatingcount', diff --git a/src/utils/fullScreenUrl.ts b/src/utils/fullScreenUrl.ts index dc993d4..1b6414d 100644 --- a/src/utils/fullScreenUrl.ts +++ b/src/utils/fullScreenUrl.ts @@ -3,15 +3,15 @@ return [ { name: '碳足迹监测', - url: 'https://share.shanhaibi.com/645b6b3674e29/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, { name: '碳足迹评价', - url: 'https://share.shanhaibi.com/645b6ba377610/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, { name: '碳足迹预警', - url: 'https://share.shanhaibi.com/645b6c6749576/', + url: 'https://share.shanhaibi.com/6476b2cd921ee/', }, ] } diff --git a/src/views/count/components/result.vue b/src/views/count/components/result.vue index 28d63eb..241b163 100644 --- a/src/views/count/components/result.vue +++ b/src/views/count/components/result.vue @@ -2,7 +2,7 @@ import carbonAnalyse from './carbonAnalyse.vue' import carbonElement from './carbonElement.vue' import carbonGather from './carbonGather.vue' -const emit = defineEmits(['bak']) +const $router = useRouter() const carbonData = ref([]) onMounted(() => { carbonData.value = JSON.parse(sessionStorage.getItem('计算结果') as string) || [] @@ -64,11 +64,6 @@ @@ -170,15 +170,20 @@ background-image: url("../../../assets/images/result-bg.png"); } +// .container { +// position: relative; +// } + // .bak { // position: absolute; // top: 30px; // left: 10%; // } .bak-btn { - position: absolute; - left: 0; - top: 0; + position: fixed; + right: 7px; + top: 52px; + z-index: 99; } .content { @@ -188,6 +193,7 @@ min-height: 100vh; // margin-top: -85px; border-radius: 8px; + // background-image: url("../../../assets/images/result-bg.png") no-repeat; .echarts { display: flex; @@ -209,6 +215,7 @@ height: 8rem !important; // background-color: #ccc; padding: 1.5rem 3rem 4rem 2.5rem !important; + // padding: 0 !important; .logo { top: 1rem !important; diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue index f830785..f902885 100644 --- a/src/views/dashboard/index.vue +++ b/src/views/dashboard/index.vue @@ -10,16 +10,20 @@ const bodyHeight = document.body.clientHeight - 50 mainHeight.value = bodyHeight }) +const mapRef = ref() +const change = () => { + mapRef.value.changeLayerGrop() +}