Commit 61999aec by jlc

update:线案例的添加

parent 3a5d5a93
import vueCodePoint from '@/examples/point.vue?raw'
import vueCodeLine from '@/examples/line.vue?raw'
import vueCodeMultiLine from '@/examples/multiLine.vue?raw'
import vueCodePlane from '@/examples/plane.vue?raw'
......@@ -9,7 +10,8 @@ import vueCodeWaterSurface from '@/examples/waterSurface.vue?raw'
const vueCodeMap = {
: vueCodePoint,
多线: vueCodeMultiLine,
线: vueCodeLine,
多颜色线: vueCodeMultiLine,
多面: vueCodePlane,
: vueCodeRain,
......
import functionCodePoint from '@/examples/point-function.js?raw'
import functionCodeLine from '@/examples/line-function.js?raw'
import functionCodeMultiLine from '@/examples/multiLine-function.js?raw'
import functionCodePlane from '@/examples/plane-function.js?raw'
......@@ -9,7 +10,8 @@ import functionCodeWaterSurface from '@/examples/waterSurface-function.js?raw'
const functionCodeMap = {
: functionCodePoint,
多线: functionCodeMultiLine,
线: functionCodeLine,
多颜色线: functionCodeMultiLine,
多面: functionCodePlane,
: functionCodeRain,
......
export function addLine() {
const script = document.createElement('script');
script.src = 'https://cesium.com/downloads/cesiumjs/releases/1.119/Build/Cesium/Cesium.js';
script.onload = () => {
window.Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3Njg4ZWU5Yi1iZDhiLTRhYmUtOTRiYS04YjM5NmUwNjVmMDMiLCJpZCI6MjI3MzQ3LCJpYXQiOjE3MjA1MjA4Mjh9.E5XW4LnwgfVAaBC-znaYr61m4yK0-j2qEQhi9qwFFPE'
const viewer = new window.Cesium.Viewer('cesiumContainer', {
infoBox: false,
});
const line = viewer.entities.add({
polyline: {
positions: Cesium.Cartesian3.fromDegreesArray([120, 30, 121, 30]), // 线的起始和结束经纬度
material: Cesium.Color.YELLOW, // 线的颜色
width: 5
}
})
viewer.zoomTo(line)
};
document.head.appendChild(script);
const link = document.createElement('link');
link.rel = 'stylesheet';
link.href = 'https://cesium.com/downloads/cesiumjs/releases/1.119/Build/Cesium/Widgets/widgets.css';
document.head.appendChild(link);
}
<template>
<div id="cesiumContainer" class="cesium-container"></div>
</template>
<script setup>
import { onMounted } from 'vue';
import { addLine } from './function';
onMounted(() => {
addLine()
});
</script>
<style>
.cesium-container {
width: 100%;
height: 100vh;
}
</style>
\ No newline at end of file
......@@ -5,10 +5,10 @@ export const elementGraphicMap = {
},
线: {
title: '线',
pngUrl: '/src/assets/Point.png'
pngUrl: '/src/assets/Line.png'
},
多线: {
title: '多线',
颜色线: {
title: '多颜色线',
pngUrl: '/src/assets/MultiLine.png'
},
多面: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment