官方示例之地球模块十一:创建GeoPolygon

/**
 * 创建 GeoBuilding 对象
 */
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'
	});

	// 创建一个瓦片图层
	var tileLayer1 = app.create({
		type: 'TileLayer',
		name: 'tileLayer1',
		url: 'https://mt{0,1,2,3}.google.cn/vt/lyrs=s&hl=zh-CN&gl=cn&x={x}&y={y}&z={z}',
		style: {
			template: CMAP.TileLayerStyle.DARKGREEN // 设置瓦片图层的样式为DARKGREEN
		}
	});
	// 将瓦片图添加到地图中
	map.addLayer(tileLayer1);
	// 创建一个建筑物图层
	var buildingLayer = app.create({
		type: 'ThingLayer',
		name: 'buildingLayer'
	});
	// 将 buildingLayer 添加到 map 中
	map.addLayer(buildingLayer);

	// 飞到地理位置和高度
	app.camera.earthFlyTo({
		lonlat: [116.4488, 39.9187],
		height: 3000,
		time: 2000,
		complete: function () {
			createBuilding()
		}
	});
	var createBuilding = function () {
		$.ajax({
			type: 'GET',
			url: 'https://www.thingjs.com/uearth/uGeo/chaoyang_building.geojson',
			dataType: 'json',
			success: function (data) {
				createBuildings(data);
			}
		});
	};

	function createBuildings(data) {
		var cnt = data.features.length;
		console.log('共 ' + cnt + '个建筑');

		for (var i = 0; i < cnt; i += 1) {
			var feature = data.features[i];

			var building = app.create({
				type: 'GeoBuilding',
				name: 'build' + i,
				coordinates: feature.geometry.coordinates,
				userData: feature.properties,
				height: feature.properties.height,
				renderer: {
					type: 'image',
					imageUrl: ['https://www.thingjs.com/uearth/uGeo/building_top.png', 'https://www.thingjs.com/uearth/uGeo/building.png'], // 楼宇顶部贴图和侧边贴图
					blending: true // 贴图叠加混合
				}
			});
			buildingLayer.add(building);
		}
	}

	app.on('click', '.GeoBuilding', function (ev) {
		var obj = ev.object;
		var height = obj.userData.height;
		var district = obj.userData.district;

		console.log('建筑高度 ' + height + 'm 所属街道 ' + district);
	})
});
posted @ 2020-10-19 15:07  ThingJS_森友鹿锘  阅读(223)  评论(0编辑  收藏  举报