cesium-在选定点上绘制一组圆形线
cesium-Draw a set of lines in shape of circle on selected point
我要从点击的地方画出一组圆形的线 point.My 代码工作正常但是它画的圆离点击的地方很远 point.Can 有人帮我弄清楚在哪里是我的错吗?
var viewer = new Cesium.Viewer('cesiumContainer');
var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
handler.setInputAction(function(click) {
var alertText = '';
function addToMessage(key, value) {
alertText += key + ': ' + value + '\n';
}
// var pickedObject = scene.pick(click.position);
// addToMessage('target', pickedObject.id.id);
var position = viewer.camera.pickEllipsoid(click.position);
addToMessage('screenX', click.position.x);
addToMessage('screenY', click.position.y);
addToMessage('didHitGlobe', Cesium.defined(position));
var cartographicPosition = Cesium.Ellipsoid.WGS84.cartesianToCartographic(position);
addToMessage('longitude', cartographicPosition.longitude);
addToMessage('latitude', Cesium.Math.toDegrees(cartographicPosition.latitude));
terrainSamplePositions = [cartographicPosition];
Cesium.sampleTerrain(viewer.terrainProvider, 9, terrainSamplePositions).then(function() {
addToMessage('height', terrainSamplePositions[0].height);
}).always(function() {
// alert(alertText);
});
// var x=Cesium.Math.toDegrees(cartographicPosition.latitude);
// var y=Cesium.Math.toDegrees(cartographicPosition.longitude);
var y=cartographicPosition.latitude;
var x=cartographicPosition.longitude;
// alert(x);//35
// alert(y);//-101
var radius=0.01;
var segmants=360;
var seg=Math.PI*2/segmants;
var origin= new Cesium.Cartesian3(x, y, 0);
var shape = [];
for (i = 0; i <= segmants; i++) {
var teta=seg*i;
var a =x+Math.cos(teta)*radius;
var b =y+Math.sin(teta)*radius;
// shape.push(a);
// shape.push(b);
var origin= new Cesium.Cartesian3(x, y, 0);
console.log(["origin is",origin.y,origin.x]);
var direction= new Cesium.Cartesian3(a, b, 0);
console.log(["direction is",direction.y,direction.x]);
viewer.entities.add({
name : 'Red line on the surface',
polyline : {
positions : Cesium.Cartesian3.fromCartographicArray([origin.x, origin.y,
direction.x, direction.y]),
width : 5,
material : Cesium.Color.RED
}
});
}
viewer.zoomTo(resultPolygon.position);
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
感谢您的帮助
如果要画圆,画一个ellipse geometry有轮廓的更简单。对于圆,将 semiMinorAxis 设置为与 semiMajorAxis 相同的值,其值以米为单位。
var position = viewer.camera.pickEllipsoid(click.position);
var cartographicPosition = Cesium.Ellipsoid.WGS84.cartesianToCartographic(position);
var y = cartographicPosition.latitude;
var x = cartographicPosition.longitude;
var entity = viewer.entities.add({
position: Cesium.Cartesian3.fromRadians(x, y),
ellipse : {
semiMinorAxis : 10,
semiMajorAxis : 10,
fill : false,
outline: true,
material : Cesium.Color.RED,
outlineColor : Cesium.Color.RED,
outlineWidth : 2
}
});
viewer.zoomTo(entity);
我要从点击的地方画出一组圆形的线 point.My 代码工作正常但是它画的圆离点击的地方很远 point.Can 有人帮我弄清楚在哪里是我的错吗?
var viewer = new Cesium.Viewer('cesiumContainer');
var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
handler.setInputAction(function(click) {
var alertText = '';
function addToMessage(key, value) {
alertText += key + ': ' + value + '\n';
}
// var pickedObject = scene.pick(click.position);
// addToMessage('target', pickedObject.id.id);
var position = viewer.camera.pickEllipsoid(click.position);
addToMessage('screenX', click.position.x);
addToMessage('screenY', click.position.y);
addToMessage('didHitGlobe', Cesium.defined(position));
var cartographicPosition = Cesium.Ellipsoid.WGS84.cartesianToCartographic(position);
addToMessage('longitude', cartographicPosition.longitude);
addToMessage('latitude', Cesium.Math.toDegrees(cartographicPosition.latitude));
terrainSamplePositions = [cartographicPosition];
Cesium.sampleTerrain(viewer.terrainProvider, 9, terrainSamplePositions).then(function() {
addToMessage('height', terrainSamplePositions[0].height);
}).always(function() {
// alert(alertText);
});
// var x=Cesium.Math.toDegrees(cartographicPosition.latitude);
// var y=Cesium.Math.toDegrees(cartographicPosition.longitude);
var y=cartographicPosition.latitude;
var x=cartographicPosition.longitude;
// alert(x);//35
// alert(y);//-101
var radius=0.01;
var segmants=360;
var seg=Math.PI*2/segmants;
var origin= new Cesium.Cartesian3(x, y, 0);
var shape = [];
for (i = 0; i <= segmants; i++) {
var teta=seg*i;
var a =x+Math.cos(teta)*radius;
var b =y+Math.sin(teta)*radius;
// shape.push(a);
// shape.push(b);
var origin= new Cesium.Cartesian3(x, y, 0);
console.log(["origin is",origin.y,origin.x]);
var direction= new Cesium.Cartesian3(a, b, 0);
console.log(["direction is",direction.y,direction.x]);
viewer.entities.add({
name : 'Red line on the surface',
polyline : {
positions : Cesium.Cartesian3.fromCartographicArray([origin.x, origin.y,
direction.x, direction.y]),
width : 5,
material : Cesium.Color.RED
}
});
}
viewer.zoomTo(resultPolygon.position);
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
感谢您的帮助
如果要画圆,画一个ellipse geometry有轮廓的更简单。对于圆,将 semiMinorAxis 设置为与 semiMajorAxis 相同的值,其值以米为单位。
var position = viewer.camera.pickEllipsoid(click.position);
var cartographicPosition = Cesium.Ellipsoid.WGS84.cartesianToCartographic(position);
var y = cartographicPosition.latitude;
var x = cartographicPosition.longitude;
var entity = viewer.entities.add({
position: Cesium.Cartesian3.fromRadians(x, y),
ellipse : {
semiMinorAxis : 10,
semiMajorAxis : 10,
fill : false,
outline: true,
material : Cesium.Color.RED,
outlineColor : Cesium.Color.RED,
outlineWidth : 2
}
});
viewer.zoomTo(entity);