| | |
| | | <div>{{ $t(item.label) }}</div> |
| | | </div> |
| | | <mapinfo ref="mapinfo" /> |
| | | <maplayer ref="maplayer" /> |
| | | <input type="file" accept=".kml" class="file" style="display: none" /> |
| | | </div> |
| | | </template> |
| | |
| | | <script> |
| | | import { transform } from 'ol/proj'; |
| | | import mapinfo from '../Tools/mapinfo.vue'; |
| | | import maplayer from '../Tools/maplayer.vue'; |
| | | |
| | | export default { |
| | | components: { mapinfo }, |
| | | components: { mapinfo, maplayer }, |
| | | data() { |
| | | return { |
| | | showTwoMenuFlag: false, |
| | |
| | | } |
| | | }, |
| | | handleOpenClick() { |
| | | // let that = this; |
| | | sgworld.Creator.SimpleGraphic.edit(true, { editProp: true }); |
| | | let fileInput = document.querySelector('.file'); |
| | | fileInput.onchange = function (evt) { |
| | | let files = evt.target.files; |
| | |
| | | let fileReader = new FileReader(); |
| | | fileReader.readAsDataURL(file); |
| | | fileReader.onload = () => { |
| | | sgworld.Viewer.dataSources |
| | | .add( |
| | | Cesium.KmlDataSource.load(fileReader.result, { |
| | | camera: sgworld.Viewer.scene.camera, |
| | | canvas: sgworld.Viewer.scene.canvas, |
| | | }) |
| | | ) |
| | | .then((KmlDataSource) => { |
| | | console.log(KmlDataSource); |
| | | // let entities = kmlDataSource.entities; |
| | | }); |
| | | var kmlOptions = { |
| | | camera: sgworld.Viewer.scene.camera, |
| | | canvas: sgworld.Viewer.scene.canvas, |
| | | clampToGround: true, |
| | | }; |
| | | var geocachePromise = Cesium.KmlDataSource.load( |
| | | fileReader.result, |
| | | kmlOptions |
| | | ); |
| | | geocachePromise.then(function (dataSource) { |
| | | var geocacheEntities = dataSource.entities.values; |
| | | |
| | | for (var i = 0; i < geocacheEntities.length; i++) { |
| | | var entity = geocacheEntities[i]; |
| | | |
| | | sgworld.Viewer.entities.add(entity); |
| | | } |
| | | }); |
| | | // sgworld.Viewer.dataSources |
| | | // .add( |
| | | // Cesium.KmlDataSource.load(fileReader.result, { |
| | | // camera: sgworld.Viewer.scene.camera, |
| | | // canvas: sgworld.Viewer.scene.canvas, |
| | | // }) |
| | | // ) |
| | | // .then((KmlDataSource) => { |
| | | // console.log(KmlDataSource); |
| | | // // let entities = kmlDataSource.entities; |
| | | // }); |
| | | }; |
| | | } |
| | | // fileInput.value = null; |
| | |
| | | break; |
| | | } |
| | | }, |
| | | setCoverage(res) { |
| | | switch (res) { |
| | | case 'a1': |
| | | this.$refs && this.$refs.maplayer && this.$refs.maplayer.open(); |
| | | break; |
| | | } |
| | | }, |
| | | menuChange(res) { |
| | | this.setListTwoMenu = this.setListTwoMenuAll[res]; |
| | | }, |
| | |
| | | this.$bus.$on('setChangeTwoMenu', (res) => { |
| | | this.menuChange(res); |
| | | }); |
| | | this.$bus.$on('showLeftMenu', (res) => { |
| | | this.$store.state.showAllLayers = true; |
| | | this.setCoverage('a1'); |
| | | // this.$bus.$emit('setAllLayers', true); |
| | | }); |
| | | }, |
| | | }; |
| | | </script> |