vue-iclient3d-webgl-l
Advanced tools
Supermap iClient3D WebGL for Vue.js(copy for https://github.com/nihaoaWO/vue-iClient3D_for_Cesium.git)
npm install @supermap/vue-iclient3d-webgl
#####1、修改main.js文件：
import Vue from 'vue';
import App from './App.vue';
//引用第三方库
import ViewUI from 'view-design';
import 'view-design/dist/styles/iview.css';
Vue.use(ViewUI);
import axios from 'axios'
window.axios = axios //挂载到window上
import echarts from 'echarts'
window.echarts = echarts //挂载到window上
//引用@supermap/vue-iclient3d-webgl组件库
import VueiClientWebgl from '@supermap/vue-iclient3d-webgl';
Vue.use(VueiClientWebgl);
new Vue({
el: '#app',
render: h => h(App)
});
#####2、修改index.html文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>vue-iclient3d-webgl</title>
<!-- 组件css-->
<link href="./static/css/geoFont/iconfont.css" rel="stylesheet">
<!-- Cesium-->
<link href="./static/Cesium/Widgets/widgets.css" rel="stylesheet">
<script src="./static/Cesium/Cesium.js"></script>
<!-- supermap-->
<script src="./static/js/config.js"></script>
<script src="./static/js/tooltip.js"></script>
</head>
<body>
<div id="app"></div>
<!-- supermap组件-->
<script src="./dist/vue-iclient3d-webgl.min.js"></script>
</body>
</html>
#####3、在 vue 工程中的App.vue 中标签引入组件：
<template>
<div id="app">
<sm-viewer>
<sm3d-measure></sm3d-measure>
</sm-viewer>
</div>
</template>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>cdn引入测试</title>
<!-- //引入Cesium依赖 -->
<link href="./node_modules/@supermap/iclient3d-webgl/Cesium/Widgets/widgets.css" rel="stylesheet">
<script src="./node_modules/@supermap/iclient3d-webgl/Cesium/Cesium.js"></script>
<!-- //引入Vue.js -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<link href="./node_modules/@supermap/vue-iclient3d-webgl/static/css/geoFont/iconfont.css" rel="stylesheet">
<!-- //引入view-design控件库 -->
<link rel="stylesheet" href="//unpkg.com/view-design/dist/styles/iview.css">
<script src="//unpkg.com/view-design/dist/iview.min.js"></script>
<!-- //引入组件的库 -->
<script src="./node_modules/@supermap/vue-iclient3d-webgl/dist/vue-iclient3d-webgl.min.js"></script>
<style>
html,
body,
#app {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body>
<div id="app">
<sm-viewer :scene-url="URL">
<sm3d-measure></sm3d-measure>
</sm-viewer>
</div>
<script>
new Vue({
el: '#app',
data: {
URL: "http://www.supermapol.com/realspace/services/3D-ZF_normal/rest/realspace"
},
methods: {}
})
</script>
</body>
</html>
http://support.supermap.com.cn:8090/webgl/examples/component/examples.html#layer
FAQs
Supermap iClient3D WebGL for Vue.js(copy for https://github.com/nihaoaWO/vue-iClient3D_for_Cesium.git)
The npm package vue-iclient3d-webgl-l receives a total of 0 weekly downloads. As such, vue-iclient3d-webgl-l popularity was classified as not popular.
We found that vue-iclient3d-webgl-l demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
/Security News
Ongoing npm supply chain attack spreads to DuckDB: multiple packages compromised with the same wallet-drainer malware.
Security News
The MCP Steering Committee has launched the official MCP Registry in preview, a central hub for discovering and publishing MCP servers.
Product
Socket’s new Pull Request Stories give security teams clear visibility into dependency risks and outcomes across scanned pull requests.