[Cesium] 사각형 컨투어 그리기

 

 

sandcastle.cesium.com/#c=nVdrb9s2FP0rXD7U8urSSdsBQ2IHC1y3NZakQWysGBAgYCXaJkKRAknLj8D/fZeU9aAkB8b0wZDu5Tn3wddxShRKGV1ThYZI0DUaUc1WMf7H2YJO6D5HUhjCBFWd7tWTSAGjQyooQDIsdp/gypxGsYUUMqZGbR9paIhYcPqgWMwMS8thKnf9ZJFZAtk5Pj+/cO75SoSGSYFIFDUZgpAoIxeKJEsWdtHrk0DweJR+NQWFh8RcigUzq4iiD7VkesgfSMxp4wrC9ycS1sd1Xfm2nH4fjWScrAxFOllSxULCUSilipgghmok58gsaYnvaHQvlVmOiTaIiAhN5cosf1L4CqWCydNln3TuGkFW0CMioGGHZhWmT3iuZPxIInjXQREHrwHXK+NiR2YTz9lFnsb/YafEZ3dkZVu87KHeGLrSRi6ci+1o0Ky1V10bJSbothZxUpBmyW8GKcPYZt4kiZIbFhO35IfojpglJlD/x6BWKt726tXjTTVr52zn00w06HZVLNmxGNzjjaHC+GnUmmHTqJs2XdgdjWqq9Dxb8zV+m1ada2e5mqV4jZsrsoiBaLokEVWw1lUIuz7z26cz55KY9oZ0YN+1ON6jzhW4Ghxtc2QpmvZjDI3aLbxmPIqtTYuDerYCWcGmkkUohkM76Pqkr/6naycNP6O1VDwa2fMFYoS7+JmJFM4Mam8C9LuzrJmI5Homx1s6Kg+iYMGfv8JkOBPewNLwDLDEWiN+QiLfWOU2KpMAoh3qV7LC6zYiv73Ala+nw+o+isgaaAGwwHNAtqwPm+oYdAWgoIjYtk67kLg/uUfJUkd2SKZl/ziq6mQ3JrqYwFByaW9x+xGseijt2Qu1hy7weVsxbI4C8KPBECp69w5+4A3G2veDPbXv6cEO92yTxD7FbGfhXRot8faIck3RKzqJxRXh0s9rOFrI3jftO8Ux8bYO8SVCKS5eS7IFzcAToQEMWghdVjHfau4qtAr3UUUmObwOs08pZC7Ld3/Yvlt+77u98oMkCSXKJuQHhvMWZAThN4W/Hrn1TL1sNVdjZ+/7/C5xYhAneUM1BhEXvD0XFrrPdeESxAuvC9JpqCgV04SEdJxCLt+zQUEWLCSA1JblAMaamokA9XTjdGSQC8oglim1tRSysZGtonbMCQnnuyhjiCWcBr8Nh2XCYL0DI7778fjwfXL/rQjpAxMWvjxIzWx601WSwF1II29sfuWFFTl1EN4hiakijmPMOUs0HPtFjTg50JaSoxr+kGhE5yDto6Bg7zaCVxPINawviApla0VdoXYqnFdNxhO0fQ21r6y6w6KDddM7tkZm24Ti2/HX2fPodjL6u1v882ACYhF+W8j1Ifrw5zm+uPLdpLhV4BBy4PaUj/XhC11AQjqoh+vVIzhN6M8ol/LlxgTtqvl04mMqtDxa/ziHB07WYynM4KTQc7gVg/IYUWzzGU++jO9nk9m/WVvPemcDbbacXmcT8xeL7UpGK8UDjPuGxgm3aqH/axW+UIND7bbroJ+DBhFLEYuGT2e1/5xPZyjkRGvwzFecT0EnPJ1dD/ow3oPBfQqKZPEDVAsnWztkeXF9mxkxxoM+fDZRRkr+i6gK438

Cesium Sandcastle

var viewer = new Cesium.Viewer('cesiumContainer');
var scene = viewer.scene;

var trigonometryRectanglePrimitive;

var rectangleWidth = 0.001;

function addRectanglePrimitive(cartographic) {
    var rectangle = new Cesium.Rectangle(cartographic.longitude - rectangleWidth, cartographic.latitude - rectangleWidth, cartographic.longitude + rectangleWidth, cartographic.latitude + rectangleWidth);

    // Compute spherical coordinates of the rectangle's NorthEast and SouthWest corners
    var southWestCartesian = Cesium.Cartesian3.fromRadians(rectangle.west, rectangle.south);
    var northEastCartesian = Cesium.Cartesian3.fromRadians(rectangle.east, rectangle.north);

    var southWestNormal = Cesium.Cartesian3.normalize(southWestCartesian, new Cesium.Cartesian3());
    var northEastNormal = Cesium.Cartesian3.normalize(northEastCartesian, new Cesium.Cartesian3());

    var westApproximation = Math.atan2(southWestNormal.y, southWestNormal.x);
    var southApproximation = Math.asin(southWestNormal.z);
    var azimuthExtent = Math.atan2(northEastNormal.y, northEastNormal.x) - westApproximation;
    var altitudeExtent = Math.asin(northEastNormal.z) - southApproximation;

    var fragmentShaderSource =
        'float southApproximation = ' + southApproximation + ';' +
        'float westApproximation = ' + westApproximation + ';' +
        'float altitudeExtent = ' + altitudeExtent + ';' +
        'float azimuthExtent = ' + azimuthExtent + ';' +

        'void main()' +
        '{' +
        '    vec4 worldCoord = czm_inverseView * czm_windowToEyeCoordinates(gl_FragCoord.xy, gl_FragCoord.z);' +
        '    vec3 normal = normalize(worldCoord.xyz / worldCoord.w);' +
        '    float altitude = asin(normal.z);' +
        '    float azimuth = atan(normal.y, normal.x);' +
        '    float u = (altitude - southApproximation) / altitudeExtent;' +
        '    float v = (azimuth - westApproximation) / azimuthExtent;' +

        '    vec4 color = vec4(u, v, 0.0, 1.0);' +
        '    if (0.0 <= u && u <= 1.0 && 0.0 <= v && v <= 1.0) {' +
        '        gl_FragColor = color;' +
        '    } else { ' +
        '        gl_FragColor = vec4(0.0, 0.0, 1.0, 1.0);' +
        '    }' +
        '}';

    trigonometryRectanglePrimitive = new Cesium.Primitive({
        geometryInstances : new Cesium.GeometryInstance({
            geometry : new Cesium.RectangleGeometry({
                rectangle : rectangle
            })
        }),
        appearance : new Cesium.MaterialAppearance({
            fragmentShaderSource : fragmentShaderSource
        })
    });
    scene.primitives.add(trigonometryRectanglePrimitive);
}

var handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
handler.setInputAction(function(movement) {
    scene.primitives.remove(trigonometryRectanglePrimitive);
    if (scene.mode !== Cesium.SceneMode.MORPHING) {
        if (scene.pickPositionSupported) {
            var cartesian = viewer.camera.pickEllipsoid(movement.position);

            if (Cesium.defined(cartesian)) {
                var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
                addRectanglePrimitive(cartographic);
            }
        }
    }
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);

var initialLongitude = -80.1;
var initialLatitude = 0.0;

addRectanglePrimitive(Cesium.Cartographic.fromDegrees(initialLongitude, initialLatitude));
viewer.camera.lookAt(Cesium.Cartesian3.fromDegrees(initialLongitude, initialLatitude), new Cesium.Cartesian3(0.0, 0.0, 50000.0));
viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);