该方法可实现百度上拾取的经纬度,在你cesium自定义3d tiles瓦片场景中,添加3d (gltf)模型贴地行走动画,3d(gltf)上面可以有标牌显示模型名字
//starLng(起始点经度), startLat(起始点纬度), endLng(结束点经度), endLat(结束点纬度)
*地图坐标转换参考文章https://www.jianshu.com/p/2ec37020041e
function addCarModel(starLng, startLat, endLng, endLat) {
var sa1 = bd09togcj02(starLng, startLat); //转换拿到的百度经度为火星坐标
var sa2 = gcj02towgs84(sa1[0], sa1[1]); //转换拿到的百度纬度为火星坐标
var ea1 = bd09togcj02(endLng, endLat); //转换拿到的火星经度为wgs-84坐标
var ea2 = gcj02towgs84(ea1[0], ea1[1]); //转换拿到的火星纬度为wgs-84坐标
var pos1 = Cesium.Cartesian3.fromDegrees(sa2[0], sa2[1]);
var pos2 = Cesium.Cartesian3.fromDegrees(ea2[0], ea2[1]);
var carCzml = [{
id: "document",
version: "1.0",
clock: {
interval: "2018-07-19T15:18:00Z/2018-07-19T15:18:30Z",
currentTime: "2018-07-19T15:18:00Z",
// multiplier: 5,
// range: "LOOP_STOP",
// step: "SYSTEM_CLOCK_MULTIPLIER"
}
},
{
id: "car1",
model: {
gltf: "img/car03.glb",
scale: 6.0,
minimumPixelSize: 168,
maximumScale: 200000,
},
label: {
text: "汽车001",
fillColor: {
rgba: [255, 254, 249, 255],
},
font: "14pt Lucida Console",
horizontalOrigin: "LEFT",
pixelOffset: {
cartesian2: [-30, -64],
},
show: true,
style: "FILL",
showBackground: true,
backgroundColor: {
rgba: [252, 12, 0, 200],
}
},
position: {
interpolationAlgorithm: "LINEAR",
forwardExtrapolationType: "HOLD",
cartesian: [
"2018-07-19T15:18:00Z", pos1.x, pos1.y, pos1.z,
"2018-07-19T15:18:30Z", pos2.x, pos2.y, pos2.z
]
}
},
{
id: "Polyline",
polyline: {
positions: {
cartesian: [
pos1.x, pos1.y, pos1.z,
pos2.x, pos2.y, pos2.z
]
},
material: {
polylineOutline: {
color: {
rgba: [255, 255, 0, 255]
},
outlineColor: {
rgba: [0, 0, 0, 255]
},
outlineWidth: 2
}
},
width: 10,
clampToGround: true
}
}
];
var scene = viewer.scene;
var clock = viewer.clock;
var entity;
var positionProperty;
// czml加载到场景中
var carModel = viewer.dataSources.add(Cesium.CzmlDataSource.load(carCzml)).then(function(dataSource) {
entity = dataSource.entities.getById("car1");
positionProperty = entity.position;
entity.orientation = new Cesium.VelocityOrientationProperty(entity.position);
});
if (scene.clampToHeightSupported) {
tiles.initialTilesLoaded.addEventListener(start); //tiles为自定义3d场景瓦片
} else {
window.alert("浏览器不支持贴地!");
}
function start() {
clock.shouldAnimate = true;
var objectsToExclude = [entity];
scene.postRender.addEventListener(function () {
var position = positionProperty.getValue(clock.currentTime);
entity.position = scene.clampToHeight(position, objectsToExclude);
});
}
return carModel;
}