<template> <div id="homePage"> <div id="cesiumContainer" style="height: 100%"></div> <div @click="mockGetuser" id="Btn">1011</div> <div @click="mockGetuser2" id="Btn2">2022</div> </div> </template> <script> import { defineComponent, ref, onMounted } from "vue"; import { jkqWms} from "@/services"; export default defineComponent({ name: "homePage", setup() { onMounted(() => { var viewer = new Cesium.Viewer("cesiumContainer", { // imageryProvider: imgTDT, navigation: false, animation: false, // 隐藏动画控件 baseLayerPicker: false, // 隐藏图层选择控件 fullscreenButton: false, // 隐藏全屏按钮 vrButton: false, // 隐藏VR按钮,默认false geocoder: false, // 隐藏地名查找控件 homeButton: false, // 隐藏Home按钮 navigationHelpButton: false, // 隐藏帮助按钮 infoBox: false, //是否显示信息框 fullscreenButton: false, //是否显示全屏按钮 animation: false, //是否创建动画小器件,左下角仪表 timeline: false, //是否显示时间轴 selectionIndicator: false, //关闭点击绿色框 scene3DOnly: true, // 每个几何实例将只在3D中呈现,以节省GPU内存 }); }); return {}; }, computed: {}, methods: { async getMock() { // 获取模拟数据 let res = await jkqWms( "?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetFeatureInfo&FORMAT=image%2Fpng&TRANSPARENT=true&QUERY_LAYERS=xiangyang%3Axynewwsj&LAYERS=xiangyang%3Axynewwsj&TILED=false&INFO_FORMAT=application%2Fjson&I=90&J=197&WIDTH=256&HEIGHT=256&CRS=EPSG%3A4326&STYLES=&BBOX=32.0361328125%2C112.12646484375%2C32.05810546875%2C112.1484375" ); console.log("res", res); }, }, }); </script> <style lang="less" scoped> #homePage { width: 100%; height: 100%; } #Btn { position: absolute; top: 200px; left: 200px; cursor: pointer; } #Btn2 { position: absolute; top: 250px; left: 200px; cursor: pointer; } </style>