gisthreemap
Version:
基于webGL的三维api
260 lines (240 loc) • 9.66 kB
JavaScript
// const BASE_SERVER_URL = "http://192.168.88.205:8090/iserver/services";
const BASE_SERVER_URL = 'http://192.168.88.205:8085/geoserver/JX';
const mapConfig = {
el: 'Threemapview',
currentTime: '2022/03/16 09:24:00',
// cesiumtoken配置
CesiumToken: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyMjg5YjI0NC1mNDkxLTQyMGQtOWU0NC02MTYxMjJhOWJhYTEiLCJpZCI6OTAxNywic2NvcGVzIjpbImFzciIsImdjIl0sImlhdCI6MTU1MzIyMzM2NH0.3LARJUnxDXtp3OAlZ1hJYCPiY9-59vyIo3NTpMswCOA',
senceOption: {
autoRotation: true, // 是否开启地球自传
sunshine: false, // 开启日照
},
// 120.753179 30.757059
mapOption: {
cityname: '嘉兴',
// 120.086881, 30.894178, 100
center: {
x: 120.753179,
y: 30.757059,
z: 20000
},
radius: 800,
heading: 0,
pitch: -45,
roll: 0
},
mapEventOption: {
openEntityEventMap: true,
pipeEventMap: true
},
baseLayer: { // 天地图 vec_w -> cva_w img_w -> cia_w
Cesium: [ //layerType: ["TileLayer", "WebTileLayer"]
// mapbox
{
// url: 'http://map.geoq.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer/tile/{z}/{y}/{x}',
id: 'baselayer_MapBox_night',
styleId: 'cla67lo3r000v15qicqfrzull',
layerType: 'MapBox_Raster',
layerIcon: 'vector',
Rectification: true,
addViewer: true,
visable: true
},
// arcgis 深色
{
url: 'http://map.geoq.cn/arcgis/rest/services/ChinaOnlineStreetPurplishBlue/MapServer/tile/{z}/{y}/{x}',
id: 'baselayer_arcgis_blue',
layerType: 'WebTileLayer',
layerIcon: 'vector',
Rectification: true,
addViewer: true,
visable: false
},
// 高德影像
{
url: 'https://webst02.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}',
id: 'baselayer_amap_img',
layerType: 'WebTileLayer',
layerIcon: 'image',
maximumLevel: 18,
Rectification: true,
addViewer: true,
visable: false
},
// 高德标注
// {
// url: 'http://webst02.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scale=1&style=8',
// id: 'baselayer_amap_label',
// layerType: "WebTileLayer",
// layerIcon: "image",
// maximumLevel: 18,
// Rectification: true,
// addViewer: true,
// visable: false
// },
// https://wprd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=8&x=54658&y=26799&z=16&scl=1<ype=4
{
url: 'http://webrd04.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}',
id: 'baselayer_amap_normal',
layerType: 'WebTileLayer',
layerIcon: 'image',
maximumLevel: 18,
Rectification: true,
addViewer: true,
visable: false
}
]
},
// 管线图层
featureLayers: [
// wms 管线图层
// {
// id: 'wspipeLayer',
// layers: 'JX:wsgx_pipe',
// style: '',
// pipeType: "管线",
// url: BASE_SERVER_URL + '/wms', //
// SR: 'EPSG:4326',
// layerType: "WMS",
// addViewer: true,
// visable: true
// },
// {
// id: 'pipeLayer',
// layername: 'DT:sl_flowpipe',
// style: 'ZT_JS',
// pipeType: "管线",
// url: BASE_SERVER_URL + '/wmts', //
// SR: 'EPSG:4326',
// matrixIds: ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2', 'EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5', 'EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8', 'EPSG:4326:9', 'EPSG:4326:10',
// 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15', 'EPSG:4326:16', 'EPSG:4326:17', 'EPSG:4326:18', 'EPSG:4326:19', 'EPSG:4326:20', 'EPSG:4326:21'
// ],
// // url: BASE_SERVER_URL + "/map-PIPETEST/rest/maps/GSPIPE%40ORCL_SM003", //超图
// layerType: "WMTS",
// addViewer: true,
// visable: true
// },
// {
// id: 'pipeCaliberLayer',
// layername: 'DT:sl_flowpipe',
// style: 'ZT_DS',
// pipeType: "口径专题",
// url: BASE_SERVER_URL + '/wmts', //
// SR: 'EPSG:4326',
// matrixIds: ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2', 'EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5', 'EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8', 'EPSG:4326:9', 'EPSG:4326:10',
// 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15', 'EPSG:4326:16', 'EPSG:4326:17', 'EPSG:4326:18', 'EPSG:4326:19', 'EPSG:4326:20', 'EPSG:4326:21'
// ],
// // url: BASE_SERVER_URL + "/map-PIPETEST/rest/maps/GSPIPE%40ORCL_SM003", //超图
// layerType: "WMTS",
// addViewer: true,
// visable: false
// },
// {
// id: 'pipeAgeLayer',
// layername: 'DT:sl_flowpipe',
// style: 'ZT_AGE',
// pipeType: "管龄专题",
// url: BASE_SERVER_URL + '/wmts', //
// SR: 'EPSG:4326',
// matrixIds: ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2', 'EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5', 'EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8', 'EPSG:4326:9', 'EPSG:4326:10',
// 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15', 'EPSG:4326:16', 'EPSG:4326:17', 'EPSG:4326:18', 'EPSG:4326:19', 'EPSG:4326:20', 'EPSG:4326:21'
// ],
// // url: BASE_SERVER_URL + "/map-PIPETEST/rest/maps/GSPIPE%40ORCL_SM003", //超图
// layerType: "WMTS",
// addViewer: true,
// visable: false
// },
// {
// id: 'pipeRiskLayer',
// layername: 'DT:sl_flowpipe',
// style: 'ZT_RISK',
// pipeType: "风险专题",
// url: BASE_SERVER_URL + '/wmts', //
// SR: 'EPSG:4326',
// matrixIds: ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2', 'EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5', 'EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8', 'EPSG:4326:9', 'EPSG:4326:10',
// 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15', 'EPSG:4326:16', 'EPSG:4326:17', 'EPSG:4326:18', 'EPSG:4326:19', 'EPSG:4326:20', 'EPSG:4326:21'
// ],
// // url: BASE_SERVER_URL + "/map-PIPETEST/rest/maps/GSPIPE%40ORCL_SM003", //超图
// layerType: "WMTS",
// addViewer: true,
// visable: false
// }
],
// 设备数据，由接口获取
EqumentPoints: [],
// 山川水系
waterpolygons:[
// {
// url: '/json/水体-新.json', //
// params: {
// version:"1.1.0",
// request: "GetMap",
// layers: "JX:sx_hydrgn", //图层名称
// format: "application/json;type=geojson",
// // cql_filter: "station BETWEEN 556000 AND 556100",
// // width、height、bbox参数可到 Geoserver 发布的服务中查看
// width: 768,
// height: 59,
// bbox: "120.29466247558594,30.264202117919922,121.26578521728516,31.021411895751953",
// }
// }
// {
// url: BASE_SERVER_URL + '/wms', //
// params: {
// version:"1.1.0",
// request: "GetMap",
// layers: "JX:sx_hydrgn", //图层名称
// format: "application/json;type=geojson",
// // cql_filter: "station BETWEEN 556000 AND 556100",
// // width、height、bbox参数可到 Geoserver 发布的服务中查看
// width: 768,
// height: 59,
// bbox: "120.29466247558594,30.264202117919922,121.26578521728516,31.021411895751953",
// }
// }
],
Tile3DModels: [
// {
// url: 'http://192.168.88.35:9003/model/erorl0nZ/tileset.json',
// name: '大雁塔',
// gotomodel: false,
// add: true
// },
// {
// url: 'https://earthsdk.com/v/last/Apps/assets/dayanta/tileset.json',
// name: '大雁塔',
// gotomodel: true,
// add: true
// }
{
url: 'http://192.168.88.205:9050/resrgn/tileset.json',
name: '建筑白膜',
gotomodel: true,
add:true,
// 片元着色器，建筑物泛光
customShader: {
fragmentShaderText: `
void fragmentMain(FragmentInput fsInput, inout czm_modelMaterial material) {
float _baseHeight = 90.0; // 物体的基础高度，需要修改成一个合适的建筑基础高度
float _heightRange = 60.0; // 高亮的范围(_baseHeight ~ _baseHeight + _ heightRange) 默认是 0-60米
float _glowRange = 150.0; // 光环的移动范围(高度)
float vtxf_height = fsInput.attributes.positionMC.y-_baseHeight;
float vtxf_a11 = fract(czm_frameNumber / 120.0) * 3.14159265 * 2.0;
float vtxf_a12 = vtxf_height / _heightRange + sin(vtxf_a11) * 0.1;
material.diffuse*= vec3(vtxf_a12, vtxf_a12, vtxf_a12);
float vtxf_a13 = fract(czm_frameNumber / 360.0);
float vtxf_h = clamp(vtxf_height / _glowRange, 0.0, 1.0);
vtxf_a13 = abs(vtxf_a13 - 0.5) * 2.0;
float vtxf_diff = step(0.005, abs(vtxf_h - vtxf_a13));
material.diffuse += material.diffuse * (1.0 - vtxf_diff);
}
`,
lightingModel: 'UNLIT' // UNLIT:物体漫反射，忽略环境光 PBR：使用基于物理的渲染光照计算
}
, // 片元着色器代码
// rgba: "color('rgb(6,139,218)',1)"
rgba: "color('rgb(6,139,218)',1)"
}
]
}
export default mapConfig