zoukankan      html  css  js  c++  java
  • 官方示例之地球模块十二:GeoPoint沿路径移动

    /**
     * 该示例展示了 GeoPoint 点沿由经纬度数组构成的路径移动
     */
    var app = new THING.App();
    app.background = [0, 0, 0];
    
    THING.Utils.dynamicLoad('https://www.thingjs.com/uearth/uearth.min.js', function () {
    	// 创建一个地图
    	var map = app.create({
    		type: 'Map',
    		attribution: 'Google',
    		style: {
    			night: false
    		}
    	});
    	// 创建一个瓦片图层
    	var tileLayer1 = app.create({
    		type: 'TileLayer',
    		name: '卫星影像图层',
    		// Google WGS84 卫星影像服务
    		url: 'https://mt{0,1,2,3}.google.cn/vt/lyrs=s&x={x}&y={y}&z={z}'
    	});
    	// 将瓦片图添加到底图图层中
    	map.addLayer(tileLayer1);
    	app.camera.earthFlyTo({
    		lonlat: [116.45987123250963, 39.98310099140805],
    		height: 80
    	});
    
    	// 创建一个 ThingLayer
    	var thingLayer = app.create({
    		type: "ThingLayer",
    		name: "thingLayer01"
    	});
    	// 将ThingLayer添加到地图中
    	map.addLayer(thingLayer);
    
    	// 创建一个车
    	var geoPoint = app.create({
    		type: 'GeoPoint',
    		name: '救护车',
    		userData: { '类别': '车' },
    		coordinates: [116.45987123250963, 39.98310099140805],
    		modelAngle: -45, // 模型旋转角度
    		renderer: {
    			type: 'model', // model 代表创建模型点
    			url: 'https://model.3dmomoda.com/models/4385928f07b24d77a523641fe584aa8d/0/gltf/', // 模型地址
    			size: 2  // 缩放比例
    		}
    	});
    	thingLayer.add(geoPoint);
    
    	// 路径经纬度坐标
    	var path = [[116.45987123250963, 39.98310099140805], [116.45712733268736, 39.98492187410472], [116.45771205425262, 39.98528357865959], [116.4582860469818, 39.985702824724704], [116.45957887172698, 39.98692972122187], [116.46279484033585, 39.98480267559324], [116.46120429039001, 39.98333528377564], [116.46093875169754, 39.98319553053025], [116.46078854799269, 39.983158536976276], [116.4604103565216, 39.98307632900681], [116.46008312702179, 39.98303316978326], [116.45992755889893, 39.98307632900681], [116.45987123250963, 39.98310099140805]];
    
    	new THING.widget.Button('沿路径移动', function () {
    		// 沿路径移动
    		geoPoint.moveGeoPath({
    			path: path,
    			time: 10 * 1000
    		});
    	});
    
    	new THING.widget.Button('显示/隐藏 路径', function () {
    		var geoLine = thingLayer.query('路径')[0];
    		if (!geoLine) {
    			// 创建路径
    			geoLine = app.create({
    				type: 'GeoLine',
    				name: '路径',
    				coordinates: path, // 经纬度坐标
    				renderer: {
    					type: 'image', // 代表贴图渲染
    					lineType: 'Line',
    					imageUrl: '/guide/image/uGeo/path.png',
    					numPass: 3,
    					speed: 0.5
    				}
    			});
    			thingLayer.add(geoLine);// 添加到ThingLayer中
    		}
    		else {
    			geoLine.visible = !geoLine.visible;
    		}
    	});
    });
    
  • 相关阅读:
    链堆栈的实现
    关于HyperLink的NavigateUrl属性的链接地址参数设置
    //yield return用于无缝实现迭代模式。
    NUnit的使用
    非常不错的数据访问架构
    Dictionary应用
    针对数据分析没态度的几句牢骚
    微软算法面试题(4)
    程序员面试题精选100题(60)判断二叉树是不是平衡的
    C++设计模式单件
  • 原文地址:https://www.cnblogs.com/thingjs/p/13840347.html
Copyright © 2011-2022 走看看