# square gets distorted

hi,

I need to draw identical 2d rectangles on the ground. their dimensions are m × n meters. my starting point for drawing a single square is this:

const { lat, lng } = position;
const dim = 0.001;
name: 'id',
polygon: {
hierarchy: {
positions: Cesium.Cartesian3.fromDegreesArray([
lng - dim, lat - dim,
lng + dim, lat - dim,
lng + dim, lat + dim,
lng - dim, lat + dim
]),
},
material: Cesium.Color.WHITE,
outline: false,
}
});

I expected this to be a square, but the further away from the equator I place it, the more stretched it gets. my guess is that there is s.th. about cartographic coordinates that I don't fully understand yet.

→ is there a simple way to create rectangles with side lengths specified in meters?

Hello,

Our polygons are drawn following ellipsoid geodesic lines, which is the shortest distance along the ellipsoid between the two points. This might be why you think the polygons look distorted. In 2D mode, the lines will look curved because of how the 3D sphere is projected into 2D.

Rectangles flow rhumb lines, which means they have a constant bearing relative to the latitude and longitude lines. These look curved in 3D but straight in 2D.

We do eventually plan on adding rhumb line support to polygons. We have an issue written up here: https://github.com/AnalyticalGraphicsInc/cesium/issues/4000

Best,

Hannah

I had tried rectangles before – same thing. will look into loading the rectangle from a 3d model file.

another remaining question rhough is the following: I would like to distribute objects on the ground within a certain radius from a point. but doing

const pos = {
lng: lng + (Math.cos(rndAngle) * rndDist),
lat: lat + (Math.sin(rndAngle) * rndDist),
};

obviously suffers from the same distortion and results in an ellipse rather than a circle. would you know of a way how to achieve this?

I had tried rectangles before – same thing. will look into loading the rectangle from a 3d model file.

this works.

another remaining question rhough is the following: I would like to distribute objects on the ground within a certain radius from a point. but doing

const pos = {
lng: lng + (Math.cos(rndAngle) * rndDist),
lat: lat + (Math.sin(rndAngle) * rndDist),
};

obviously suffers from the same distortion and results in an ellipse rather than a circle. would you know of a way how to achieve this?

I figured it out:
in order to get a true circle you have to project to 2d first, before you calculate the positions for new points, and then back to geographic coordinates.