@map-colonies/react-components 3.7.2 → 3.8.1

package/dist/cesium-map/tools/draw/drawHelper.js

@@ -1,1681 +0,0 @@
-"use strict";
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-// inspired by https://github.com/leforthomas/cesium-drawhelper
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
-var Cesium = __importStar(require("cesium"));
-require("./drawHelper.css");
-/* eslint-disable */
-var DrawHelper = (function () {
-    // static variables
-    var ellipsoid = Cesium.Ellipsoid.WGS84;
-    var drawingVertexColor;
-    var material = Cesium.Material.fromType(Cesium.Material.ColorType);
-    // constructor
-    function _(cesiumWidget, materialClr, drawingVertexClr) {
-        if (materialClr === void 0) { materialClr = new Cesium.Color(1.0, 1.0, 0.0, 0.5); }
-        if (drawingVertexClr === void 0) { drawingVertexClr = new Cesium.Color(1.0, 1.0, 1.0, 1.0); }
-        this._scene = cesiumWidget.scene;
-        // UPDATE scoped varibles
-        material.uniforms.color = materialClr;
-        drawingVertexColor = drawingVertexClr;
-        //MC_CHANGE disable/override tooltip
-        this._tooltip = {
-            setVisible: function () { },
-            showAt: function () { },
-        };
-        // this._tooltip = createTooltip(cesiumWidget.container);
-        this._surfaces = [];
-        this.initialiseHandlers();
-        this.enhancePrimitives();
-    }
-    _.prototype.initialiseHandlers = function () {
-        var scene = this._scene;
-        var _self = this;
-        // scene events
-        var handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-        function callPrimitiveCallback(name, position) {
-            if (_self._handlersMuted == true)
-                return;
-            var pickedObject = scene.pick(position);
-            if (pickedObject &&
-                pickedObject.primitive &&
-                pickedObject.primitive[name]) {
-                pickedObject.primitive[name](position);
-            }
-        }
-        handler.setInputAction(function (movement) {
-            callPrimitiveCallback('leftClick', movement.position);
-        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-        handler.setInputAction(function (movement) {
-            callPrimitiveCallback('leftDoubleClick', movement.position);
-        }, Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
-        var mouseOutObject;
-        handler.setInputAction(function (movement) {
-            if (_self._handlersMuted == true)
-                return;
-            var pickedObject = scene.pick(movement.endPosition);
-            if (mouseOutObject &&
-                (!pickedObject || mouseOutObject != pickedObject.primitive)) {
-                !(mouseOutObject.isDestroyed && mouseOutObject.isDestroyed()) &&
-                    mouseOutObject.mouseOut(movement.endPosition);
-                mouseOutObject = null;
-            }
-            if (pickedObject && pickedObject.primitive) {
-                pickedObject = pickedObject.primitive;
-                if (pickedObject.mouseOut) {
-                    mouseOutObject = pickedObject;
-                }
-                if (pickedObject.mouseMove) {
-                    pickedObject.mouseMove(movement.endPosition);
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-        handler.setInputAction(function (movement) {
-            callPrimitiveCallback('leftUp', movement.position);
-        }, Cesium.ScreenSpaceEventType.LEFT_UP);
-        handler.setInputAction(function (movement) {
-            callPrimitiveCallback('leftDown', movement.position);
-        }, Cesium.ScreenSpaceEventType.LEFT_DOWN);
-    };
-    _.prototype.setListener = function (primitive, type, callback) {
-        primitive[type] = callback;
-    };
-    _.prototype.muteHandlers = function (muted) {
-        this._handlersMuted = muted;
-    };
-    // register event handling for an editable shape
-    // shape should implement setEditMode and setHighlighted
-    _.prototype.registerEditableShape = function (surface) {
-        var _self = this;
-        // handlers for interactions
-        // highlight polygon when mouse is entering
-        setListener(surface, 'mouseMove', function (position) {
-            surface.setHighlighted(true);
-            if (!surface._editMode) {
-                _self._tooltip.showAt(position, 'Click to edit this shape');
-            }
-        });
-        // hide the highlighting when mouse is leaving the polygon
-        setListener(surface, 'mouseOut', function (position) {
-            surface.setHighlighted(false);
-            _self._tooltip.setVisible(false);
-        });
-        setListener(surface, 'leftClick', function (position) {
-            surface.setEditMode(true);
-        });
-    };
-    _.prototype.startDrawing = function (cleanUp) {
-        // undo any current edit of shapes
-        this.disableAllEditMode();
-        // check for cleanUp first
-        if (this.editCleanUp) {
-            this.editCleanUp();
-        }
-        this.editCleanUp = cleanUp;
-        this.muteHandlers(true);
-    };
-    _.prototype.stopDrawing = function () {
-        // check for cleanUp first
-        if (this.editCleanUp) {
-            this.editCleanUp();
-            this.editCleanUp = null;
-        }
-        this.muteHandlers(false);
-    };
-    // make sure only one shape is highlighted at a time
-    _.prototype.disableAllHighlights = function () {
-        this.setHighlighted(undefined);
-    };
-    _.prototype.setHighlighted = function (surface) {
-        if (this._highlightedSurface &&
-            !this._highlightedSurface.isDestroyed() &&
-            this._highlightedSurface != surface) {
-            this._highlightedSurface.setHighlighted(false);
-        }
-        this._highlightedSurface = surface;
-    };
-    _.prototype.disableAllEditMode = function () {
-        this.setEdited(undefined);
-    };
-    _.prototype.setEdited = function (surface) {
-        if (this._editedSurface && !this._editedSurface.isDestroyed()) {
-            this._editedSurface.setEditMode(false);
-        }
-        this._editedSurface = surface;
-    };
-    var defaultShapeOptions = {
-        ellipsoid: Cesium.Ellipsoid.WGS84,
-        textureRotationAngle: 0.0,
-        height: 0.0,
-        asynchronous: true,
-        show: true,
-        debugShowBoundingVolume: false,
-    };
-    var defaultSurfaceOptions = copyOptions(defaultShapeOptions, {
-        appearance: new Cesium.EllipsoidSurfaceAppearance({
-            aboveGround: false,
-        }),
-        material: material,
-        granularity: Math.PI / 180.0,
-    });
-    var defaultPolygonOptions = copyOptions(defaultShapeOptions, {});
-    var defaultExtentOptions = copyOptions(defaultShapeOptions, {});
-    var defaultCircleOptions = copyOptions(defaultShapeOptions, {});
-    var defaultEllipseOptions = copyOptions(defaultSurfaceOptions, {
-        rotation: 0,
-    });
-    var defaultPolylineOptions = copyOptions(defaultShapeOptions, {
-        width: 5,
-        geodesic: true,
-        granularity: 10000,
-        appearance: new Cesium.PolylineMaterialAppearance({
-            aboveGround: false,
-        }),
-        material: material,
-    });
-    //    Cesium.Polygon.prototype.setStrokeStyle = setStrokeStyle;
-    //
-    //    Cesium.Polygon.prototype.drawOutline = drawOutline;
-    //
-    var ChangeablePrimitive = (function () {
-        function _() { }
-        _.prototype.initialiseOptions = function (options) {
-            fillOptions(this, options);
-            this._ellipsoid = undefined;
-            this._granularity = undefined;
-            this._height = undefined;
-            this._textureRotationAngle = undefined;
-            this._id = undefined;
-            // set the flags to initiate a first drawing
-            this._createPrimitive = true;
-            this._primitive = undefined;
-            this._outlinePolygon = undefined;
-        };
-        _.prototype.setAttribute = function (name, value) {
-            this[name] = value;
-            this._createPrimitive = true;
-        };
-        _.prototype.getAttribute = function (name) {
-            return this[name];
-        };
-        /**
-         * @private
-         */
-        _.prototype.update = function (context, frameState, commandList) {
-            if (!Cesium.defined(this.ellipsoid)) {
-                throw new Cesium.DeveloperError('this.ellipsoid must be defined.');
-            }
-            if (!Cesium.defined(this.appearance)) {
-                throw new Cesium.DeveloperError('this.material must be defined.');
-            }
-            if (this.granularity < 0.0) {
-                throw new Cesium.DeveloperError('this.granularity and scene2D/scene3D overrides must be greater than zero.');
-            }
-            if (!this.show) {
-                return;
-            }
-            if (!this._createPrimitive && !Cesium.defined(this._primitive)) {
-                // No positions/hierarchy to draw
-                return;
-            }
-            if (this._createPrimitive ||
-                this._ellipsoid !== this.ellipsoid ||
-                this._granularity !== this.granularity ||
-                this._height !== this.height ||
-                this._textureRotationAngle !== this.textureRotationAngle ||
-                this._id !== this.id) {
-                var geometry = this.getGeometry();
-                if (!geometry) {
-                    return;
-                }
-                this._createPrimitive = false;
-                this._ellipsoid = this.ellipsoid;
-                this._granularity = this.granularity;
-                this._height = this.height;
-                this._textureRotationAngle = this.textureRotationAngle;
-                this._id = this.id;
-                this._primitive = this._primitive && this._primitive.destroy();
-                this._primitive = new Cesium.Primitive({
-                    geometryInstances: new Cesium.GeometryInstance({
-                        geometry: geometry,
-                        id: this.id,
-                        pickPrimitive: this,
-                    }),
-                    appearance: this.appearance,
-                    asynchronous: this.asynchronous,
-                });
-                this._outlinePolygon =
-                    this._outlinePolygon && this._outlinePolygon.destroy();
-                if (this.strokeColor && this.getOutlineGeometry) {
-                    // create the highlighting frame
-                    this._outlinePolygon = new Cesium.Primitive({
-                        geometryInstances: new Cesium.GeometryInstance({
-                            geometry: this.getOutlineGeometry(),
-                            attributes: {
-                                color: Cesium.ColorGeometryInstanceAttribute.fromColor(this.strokeColor),
-                            },
-                        }),
-                        appearance: new Cesium.PerInstanceColorAppearance({
-                            flat: true,
-                            renderState: {
-                                depthTest: {
-                                    enabled: true,
-                                },
-                                //MC_CHANGE
-                                lineWidth: this.strokeWidth || 4.0,
-                            },
-                        }),
-                    });
-                }
-            }
-            var primitive = this._primitive;
-            primitive.appearance.material = this.material;
-            primitive.debugShowBoundingVolume = this.debugShowBoundingVolume;
-            primitive.update(context, frameState, commandList);
-            this._outlinePolygon &&
-                this._outlinePolygon.update(context, frameState, commandList);
-        };
-        _.prototype.isDestroyed = function () {
-            return false;
-        };
-        _.prototype.destroy = function () {
-            this._primitive = this._primitive && this._primitive.destroy();
-            return Cesium.destroyObject(this);
-        };
-        _.prototype.setStrokeStyle = function (strokeColor, strokeWidth) {
-            if (!this.strokeColor ||
-                !this.strokeColor.equals(strokeColor) ||
-                this.strokeWidth != strokeWidth) {
-                this._createPrimitive = true;
-                this.strokeColor = strokeColor;
-                this.strokeWidth = strokeWidth;
-            }
-        };
-        return _;
-    })();
-    _.ExtentPrimitive = (function () {
-        function _(options) {
-            if (!Cesium.defined(options.extent)) {
-                throw new Cesium.DeveloperError('Extent is required');
-            }
-            options = copyOptions(options, defaultSurfaceOptions);
-            this.initialiseOptions(options);
-            this.setExtent(options.extent);
-        }
-        _.prototype = new ChangeablePrimitive();
-        _.prototype.setExtent = function (extent) {
-            this.setAttribute('extent', extent);
-        };
-        _.prototype.getExtent = function () {
-            return this.getAttribute('extent');
-        };
-        _.prototype.getGeometry = function () {
-            if (!Cesium.defined(this.extent)) {
-                return;
-            }
-            return new Cesium.RectangleGeometry({
-                rectangle: this.extent,
-                height: this.height,
-                vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT,
-                stRotation: this.textureRotationAngle,
-                ellipsoid: this.ellipsoid,
-                granularity: this.granularity,
-            });
-        };
-        _.prototype.getOutlineGeometry = function () {
-            return new Cesium.RectangleOutlineGeometry({
-                rectangle: this.extent,
-            });
-        };
-        return _;
-    })();
-    _.PolygonPrimitive = (function () {
-        function _(options) {
-            options = copyOptions(options, defaultSurfaceOptions);
-            this.initialiseOptions(options);
-            this.isPolygon = true;
-        }
-        _.prototype = new ChangeablePrimitive();
-        _.prototype.setPositions = function (positions) {
-            this.setAttribute('positions', positions);
-        };
-        _.prototype.getPositions = function () {
-            return this.getAttribute('positions');
-        };
-        _.prototype.getGeometry = function () {
-            if (!Cesium.defined(this.positions) || this.positions.length < 3) {
-                return;
-            }
-            return Cesium.PolygonGeometry.fromPositions({
-                positions: this.positions,
-                height: this.height,
-                vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT,
-                stRotation: this.textureRotationAngle,
-                ellipsoid: this.ellipsoid,
-                granularity: this.granularity,
-            });
-        };
-        _.prototype.getOutlineGeometry = function () {
-            return Cesium.PolygonOutlineGeometry.fromPositions({
-                positions: this.getPositions(),
-            });
-        };
-        return _;
-    })();
-    _.CirclePrimitive = (function () {
-        function _(options) {
-            if (!(Cesium.defined(options.center) && Cesium.defined(options.radius))) {
-                throw new Cesium.DeveloperError('Center and radius are required');
-            }
-            options = copyOptions(options, defaultSurfaceOptions);
-            this.initialiseOptions(options);
-            this.setRadius(options.radius);
-        }
-        _.prototype = new ChangeablePrimitive();
-        _.prototype.setCenter = function (center) {
-            this.setAttribute('center', center);
-        };
-        _.prototype.setRadius = function (radius) {
-            this.setAttribute('radius', Math.max(0.1, radius));
-        };
-        _.prototype.getCenter = function () {
-            return this.getAttribute('center');
-        };
-        _.prototype.getRadius = function () {
-            return this.getAttribute('radius');
-        };
-        _.prototype.getGeometry = function () {
-            if (!(Cesium.defined(this.center) && Cesium.defined(this.radius))) {
-                return;
-            }
-            return new Cesium.CircleGeometry({
-                center: this.center,
-                radius: this.radius,
-                height: this.height,
-                vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT,
-                stRotation: this.textureRotationAngle,
-                ellipsoid: this.ellipsoid,
-                granularity: this.granularity,
-            });
-        };
-        _.prototype.getOutlineGeometry = function () {
-            return new Cesium.CircleOutlineGeometry({
-                center: this.getCenter(),
-                radius: this.getRadius(),
-            });
-        };
-        return _;
-    })();
-    _.EllipsePrimitive = (function () {
-        function _(options) {
-            if (!(Cesium.defined(options.center) &&
-                Cesium.defined(options.semiMajorAxis) &&
-                Cesium.defined(options.semiMinorAxis))) {
-                throw new Cesium.DeveloperError('Center and semi major and semi minor axis are required');
-            }
-            options = copyOptions(options, defaultEllipseOptions);
-            this.initialiseOptions(options);
-        }
-        _.prototype = new ChangeablePrimitive();
-        _.prototype.setCenter = function (center) {
-            this.setAttribute('center', center);
-        };
-        _.prototype.setSemiMajorAxis = function (semiMajorAxis) {
-            if (semiMajorAxis < this.getSemiMinorAxis())
-                return;
-            this.setAttribute('semiMajorAxis', semiMajorAxis);
-        };
-        _.prototype.setSemiMinorAxis = function (semiMinorAxis) {
-            if (semiMinorAxis > this.getSemiMajorAxis())
-                return;
-            this.setAttribute('semiMinorAxis', semiMinorAxis);
-        };
-        _.prototype.setRotation = function (rotation) {
-            return this.setAttribute('rotation', rotation);
-        };
-        _.prototype.getCenter = function () {
-            return this.getAttribute('center');
-        };
-        _.prototype.getSemiMajorAxis = function () {
-            return this.getAttribute('semiMajorAxis');
-        };
-        _.prototype.getSemiMinorAxis = function () {
-            return this.getAttribute('semiMinorAxis');
-        };
-        _.prototype.getRotation = function () {
-            return this.getAttribute('rotation');
-        };
-        _.prototype.getGeometry = function () {
-            if (!(Cesium.defined(this.center) &&
-                Cesium.defined(this.semiMajorAxis) &&
-                Cesium.defined(this.semiMinorAxis))) {
-                return;
-            }
-            return new Cesium.EllipseGeometry({
-                ellipsoid: this.ellipsoid,
-                center: this.center,
-                semiMajorAxis: this.semiMajorAxis,
-                semiMinorAxis: this.semiMinorAxis,
-                rotation: this.rotation,
-                height: this.height,
-                vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT,
-                stRotation: this.textureRotationAngle,
-                ellipsoid: this.ellipsoid,
-                granularity: this.granularity,
-            });
-        };
-        _.prototype.getOutlineGeometry = function () {
-            return new Cesium.EllipseOutlineGeometry({
-                center: this.getCenter(),
-                semiMajorAxis: this.getSemiMajorAxis(),
-                semiMinorAxis: this.getSemiMinorAxis(),
-                rotation: this.getRotation(),
-            });
-        };
-        return _;
-    })();
-    _.PolylinePrimitive = (function () {
-        function _(options) {
-            options = copyOptions(options, defaultPolylineOptions);
-            this.initialiseOptions(options);
-        }
-        _.prototype = new ChangeablePrimitive();
-        _.prototype.setPositions = function (positions) {
-            this.setAttribute('positions', positions);
-        };
-        _.prototype.setWidth = function (width) {
-            this.setAttribute('width', width);
-        };
-        _.prototype.setGeodesic = function (geodesic) {
-            this.setAttribute('geodesic', geodesic);
-        };
-        _.prototype.getPositions = function () {
-            return this.getAttribute('positions');
-        };
-        _.prototype.getWidth = function () {
-            return this.getAttribute('width');
-        };
-        _.prototype.getGeodesic = function (geodesic) {
-            return this.getAttribute('geodesic');
-        };
-        _.prototype.getGeometry = function () {
-            if (!Cesium.defined(this.positions) || this.positions.length < 2) {
-                return;
-            }
-            return new Cesium.PolylineGeometry({
-                positions: this.positions,
-                height: this.height,
-                width: this.width < 1 ? 1 : this.width,
-                vertexFormat: Cesium.EllipsoidSurfaceAppearance.VERTEX_FORMAT,
-                ellipsoid: this.ellipsoid,
-            });
-        };
-        return _;
-    })();
-    var defaultBillboard = {
-        iconUrl: './assets/img/dragIcon.png',
-        shiftX: 0,
-        shiftY: 0,
-    };
-    var dragBillboard = {
-        iconUrl: './assets/img/dragIcon.png',
-        shiftX: 0,
-        shiftY: 0,
-    };
-    var dragHalfBillboard = {
-        iconUrl: './assets/img/dragIconLight.png',
-        shiftX: 0,
-        shiftY: 0,
-    };
-    _.prototype.createBillboardGroup = function (points, options, callbacks) {
-        var markers = new _.BillboardGroup(this, options);
-        markers.addBillboards(points, callbacks);
-        return markers;
-    };
-    _.BillboardGroup = function (drawHelper, options) {
-        this._drawHelper = drawHelper;
-        this._scene = drawHelper._scene;
-        this._options = copyOptions(options, defaultBillboard);
-        // create one common billboard collection for all billboards
-        var b = new Cesium.BillboardCollection();
-        this._scene.primitives.add(b);
-        this._billboards = b;
-        // keep an ordered list of billboards
-        this._orderedBillboards = [];
-    };
-    _.BillboardGroup.prototype.createBillboard = function (position, callbacks) {
-        var billboard = this._billboards.add({
-            show: true,
-            position: position,
-            pixelOffset: new Cesium.Cartesian2(this._options.shiftX, this._options.shiftY),
-            eyeOffset: new Cesium.Cartesian3(0.0, 0.0, 0.0),
-            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
-            verticalOrigin: Cesium.VerticalOrigin.CENTER,
-            scale: 1.0,
-            image: this._options.iconUrl,
-            color: drawingVertexColor,
-        });
-        // if editable
-        if (callbacks) {
-            var _self = this;
-            var screenSpaceCameraController = this._scene.screenSpaceCameraController;
-            function enableRotation(enable) {
-                screenSpaceCameraController.enableRotate = enable;
-            }
-            function getIndex() {
-                // find index
-                for (var i = 0, I = _self._orderedBillboards.length; i < I && _self._orderedBillboards[i] != billboard; ++i)
-                    ;
-                return i;
-            }
-            if (callbacks.dragHandlers) {
-                var _self = this;
-                setListener(billboard, 'leftDown', function (position) {
-                    // TODO - start the drag handlers here
-                    // create handlers for mouseOut and leftUp for the billboard and a mouseMove
-                    function onDrag(position) {
-                        billboard.position = position;
-                        // find index
-                        for (var i = 0, I = _self._orderedBillboards.length; i < I && _self._orderedBillboards[i] != billboard; ++i)
-                            ;
-                        callbacks.dragHandlers.onDrag &&
-                            callbacks.dragHandlers.onDrag(getIndex(), position);
-                    }
-                    function onDragEnd(position) {
-                        handler.destroy();
-                        enableRotation(true);
-                        callbacks.dragHandlers.onDragEnd &&
-                            callbacks.dragHandlers.onDragEnd(getIndex(), position);
-                    }
-                    var handler = new Cesium.ScreenSpaceEventHandler(_self._scene.canvas);
-                    handler.setInputAction(function (movement) {
-                        var cartesian = _self._scene.camera.pickEllipsoid(movement.endPosition, ellipsoid);
-                        if (cartesian) {
-                            onDrag(cartesian);
-                        }
-                        else {
-                            onDragEnd(cartesian);
-                        }
-                    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-                    handler.setInputAction(function (movement) {
-                        onDragEnd(_self._scene.camera.pickEllipsoid(movement.position, ellipsoid));
-                    }, Cesium.ScreenSpaceEventType.LEFT_UP);
-                    enableRotation(false);
-                    callbacks.dragHandlers.onDragStart &&
-                        callbacks.dragHandlers.onDragStart(getIndex(), _self._scene.camera.pickEllipsoid(position, ellipsoid));
-                });
-            }
-            if (callbacks.onDoubleClick) {
-                setListener(billboard, 'leftDoubleClick', function (position) {
-                    callbacks.onDoubleClick(getIndex());
-                });
-            }
-            if (callbacks.onClick) {
-                setListener(billboard, 'leftClick', function (position) {
-                    callbacks.onClick(getIndex());
-                });
-            }
-            if (callbacks.tooltip) {
-                setListener(billboard, 'mouseMove', function (position) {
-                    _self._drawHelper._tooltip.showAt(position, callbacks.tooltip());
-                });
-                setListener(billboard, 'mouseOut', function (position) {
-                    _self._drawHelper._tooltip.setVisible(false);
-                });
-            }
-        }
-        return billboard;
-    };
-    _.BillboardGroup.prototype.insertBillboard = function (index, position, callbacks) {
-        this._orderedBillboards.splice(index, 0, this.createBillboard(position, callbacks));
-    };
-    _.BillboardGroup.prototype.addBillboard = function (position, callbacks) {
-        this._orderedBillboards.push(this.createBillboard(position, callbacks));
-    };
-    _.BillboardGroup.prototype.addBillboards = function (positions, callbacks) {
-        var index = 0;
-        for (; index < positions.length; index++) {
-            this.addBillboard(positions[index], callbacks);
-        }
-    };
-    _.BillboardGroup.prototype.updateBillboardsPositions = function (positions) {
-        var index = 0;
-        for (; index < positions.length; index++) {
-            this.getBillboard(index).position = positions[index];
-        }
-    };
-    _.BillboardGroup.prototype.countBillboards = function () {
-        return this._orderedBillboards.length;
-    };
-    _.BillboardGroup.prototype.getBillboard = function (index) {
-        return this._orderedBillboards[index];
-    };
-    _.BillboardGroup.prototype.removeBillboard = function (index) {
-        this._billboards.remove(this.getBillboard(index));
-        this._orderedBillboards.splice(index, 1);
-    };
-    _.BillboardGroup.prototype.remove = function () {
-        this._billboards =
-            this._billboards &&
-                this._billboards.removeAll() &&
-                this._billboards.destroy();
-    };
-    _.BillboardGroup.prototype.setOnTop = function () {
-        this._scene.primitives.raiseToTop(this._billboards);
-    };
-    _.prototype.startDrawingMarker = function (options) {
-        var options = copyOptions(options, defaultBillboard);
-        this.startDrawing(function () {
-            markers.remove();
-            mouseHandler.destroy();
-            tooltip.setVisible(false);
-        });
-        var _self = this;
-        var scene = this._scene;
-        var primitives = scene.primitives;
-        var tooltip = this._tooltip;
-        var markers = new _.BillboardGroup(this, options);
-        var mouseHandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-        // Now wait for start
-        mouseHandler.setInputAction(function (movement) {
-            if (movement.position != null) {
-                var cartesian = scene.camera.pickEllipsoid(movement.position, ellipsoid);
-                if (cartesian) {
-                    markers.addBillboard(cartesian);
-                    _self.stopDrawing();
-                    options.callback(cartesian);
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-        mouseHandler.setInputAction(function (movement) {
-            var position = movement.endPosition;
-            if (position != null) {
-                var cartesian = scene.camera.pickEllipsoid(position, ellipsoid);
-                if (cartesian) {
-                    tooltip.showAt(position, '<p>Click to add your marker. Position is: </p>' +
-                        getDisplayLatLngString(ellipsoid.cartesianToCartographic(cartesian)));
-                }
-                else {
-                    tooltip.showAt(position, '<p>Click on the globe to add your marker.</p>');
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-    };
-    _.prototype.startDrawingPolygon = function (options) {
-        var options = copyOptions(options, defaultSurfaceOptions);
-        this.startDrawingPolyshape(true, options);
-    };
-    _.prototype.startDrawingPolyline = function (options) {
-        var options = copyOptions(options, defaultPolylineOptions);
-        this.startDrawingPolyshape(false, options);
-    };
-    _.prototype.startDrawingPolyshape = function (isPolygon, options) {
-        this.startDrawing(function () {
-            primitives.remove(poly);
-            markers.remove();
-            mouseHandler.destroy();
-            tooltip.setVisible(false);
-            unsetDrawCursor(scene);
-        });
-        var _self = this;
-        var scene = this._scene;
-        var primitives = scene.primitives;
-        var tooltip = this._tooltip;
-        var minPoints = isPolygon ? 3 : 2;
-        var poly;
-        if (isPolygon) {
-            poly = new DrawHelper.PolygonPrimitive(options);
-        }
-        else {
-            poly = new DrawHelper.PolylinePrimitive(options);
-        }
-        poly.asynchronous = false;
-        primitives.add(poly);
-        var positions = [];
-        var markers = new _.BillboardGroup(this, defaultBillboard);
-        var mouseHandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-        setDrawCursor(scene);
-        // Now wait for start
-        mouseHandler.setInputAction(function (movement) {
-            if (movement.position != null) {
-                var cartesian = scene.camera.pickEllipsoid(movement.position, ellipsoid);
-                if (cartesian) {
-                    // first click
-                    if (positions.length == 0) {
-                        positions.push(cartesian.clone());
-                        markers.addBillboard(positions[0]);
-                    }
-                    if (positions.length >= minPoints) {
-                        poly.positions = positions;
-                        poly._createPrimitive = true;
-                    }
-                    // add new point to polygon
-                    // this one will move with the mouse
-                    positions.push(cartesian);
-                    // add marker at the new position
-                    markers.addBillboard(cartesian);
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-        mouseHandler.setInputAction(function (movement) {
-            var position = movement.endPosition;
-            if (position != null) {
-                if (positions.length == 0) {
-                    tooltip.showAt(position, '<p>Click to add first point</p>');
-                }
-                else {
-                    var cartesian = scene.camera.pickEllipsoid(position, ellipsoid);
-                    if (cartesian) {
-                        positions.pop();
-                        // make sure it is slightly different
-                        cartesian.y += 1 + Math.random();
-                        positions.push(cartesian);
-                        if (positions.length >= minPoints) {
-                            poly.positions = positions;
-                            poly._createPrimitive = true;
-                        }
-                        // update marker
-                        markers.getBillboard(positions.length - 1).position = cartesian;
-                        // show tooltip
-                        tooltip.showAt(position, '<p>Click to add new point (' +
-                            positions.length +
-                            ')</p>' +
-                            (positions.length > minPoints
-                                ? '<p>Double click to finish drawing</p>'
-                                : ''));
-                    }
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-        mouseHandler.setInputAction(function (movement) {
-            var position = movement.position;
-            if (position != null) {
-                if (positions.length < minPoints + 2) {
-                    return;
-                }
-                else {
-                    var cartesian = scene.camera.pickEllipsoid(position, ellipsoid);
-                    if (cartesian) {
-                        unsetDrawCursor(scene);
-                        _self.stopDrawing();
-                        if (typeof options.callback == 'function') {
-                            // remove overlapping ones
-                            var index = positions.length - 1;
-                            options.callback(positions);
-                        }
-                    }
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
-    };
-    function getExtentCorners(value) {
-        return ellipsoid.cartographicArrayToCartesianArray([
-            Cesium.Rectangle.northwest(value),
-            Cesium.Rectangle.northeast(value),
-            Cesium.Rectangle.southeast(value),
-            Cesium.Rectangle.southwest(value),
-        ]);
-    }
-    // MC_CHANGE add to change draw mode cursor
-    function setDrawCursor(scene) {
-        if (scene) {
-            scene.canvas.style.cursor = 'crosshair';
-        }
-    }
-    // MC_CHANGE add to restore regular mode
-    function unsetDrawCursor(scene) {
-        if (scene) {
-            scene.canvas.style.cursor = '';
-        }
-    }
-    _.prototype.startDrawingExtent = function (options) {
-        var options = copyOptions(options, defaultSurfaceOptions);
-        this.startDrawing(function () {
-            if (extent != null) {
-                primitives.remove(extent);
-            }
-            //MC_CHANGE if added
-            if (markers != null) {
-                markers.remove();
-            }
-            mouseHandler.destroy();
-            tooltip.setVisible(false);
-            unsetDrawCursor(scene);
-        });
-        var _self = this;
-        var scene = this._scene;
-        var primitives = this._scene.primitives;
-        var tooltip = this._tooltip;
-        var firstPoint = null;
-        var extent = null;
-        var markers = null;
-        var mouseHandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-        setDrawCursor(scene);
-        function updateExtent(value) {
-            if (extent == null) {
-                //MC_CHANGE
-                extent = new DrawHelper.ExtentPrimitive({
-                    extent: value,
-                    material: options.material,
-                });
-                //extent = new Cesium.RectanglePrimitive();
-                extent.asynchronous = false;
-                primitives.add(extent);
-            }
-            extent.setExtent(value);
-            // update the markers
-            var corners = getExtentCorners(value);
-            // create if they do not yet exist
-            if (markers == null) {
-                markers = new _.BillboardGroup(_self, defaultBillboard);
-                markers.addBillboards(corners);
-            }
-            else {
-                markers.updateBillboardsPositions(corners);
-            }
-        }
-        // Now wait for start
-        mouseHandler.setInputAction(function (movement) {
-            if (movement.position != null) {
-                var cartesian = scene.camera.pickEllipsoid(movement.position, ellipsoid);
-                if (cartesian) {
-                    if (extent == null) {
-                        // create the rectangle
-                        firstPoint = ellipsoid.cartesianToCartographic(cartesian);
-                        var value = getExtent(firstPoint, firstPoint);
-                        updateExtent(value);
-                    }
-                    else {
-                        _self.stopDrawing();
-                        if (typeof options.callback == 'function') {
-                            options.callback(getExtent(firstPoint, ellipsoid.cartesianToCartographic(cartesian)));
-                        }
-                    }
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.LEFT_DOWN);
-        mouseHandler.setInputAction(function (movement) {
-            var position = movement.endPosition;
-            if (position != null) {
-                if (extent == null) {
-                    tooltip.showAt(position, '<p>Click to start drawing rectangle</p>');
-                }
-                else {
-                    var cartesian = scene.camera.pickEllipsoid(position, ellipsoid);
-                    if (cartesian) {
-                        var value = getExtent(firstPoint, ellipsoid.cartesianToCartographic(cartesian));
-                        updateExtent(value);
-                        tooltip.showAt(position, '<p>Drag to change rectangle extent</p><p>Click again to finish drawing</p>');
-                    }
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-    };
-    _.prototype.startDrawingCircle = function (options) {
-        var options = copyOptions(options, defaultSurfaceOptions);
-        this.startDrawing(function cleanUp() {
-            if (circle != null) {
-                primitives.remove(circle);
-            }
-            markers.remove();
-            mouseHandler.destroy();
-            tooltip.setVisible(false);
-        });
-        var _self = this;
-        var scene = this._scene;
-        var primitives = this._scene.primitives;
-        var tooltip = this._tooltip;
-        var circle = null;
-        var markers = null;
-        var mouseHandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-        // Now wait for start
-        mouseHandler.setInputAction(function (movement) {
-            if (movement.position != null) {
-                var cartesian = scene.camera.pickEllipsoid(movement.position, ellipsoid);
-                if (cartesian) {
-                    if (circle == null) {
-                        // create the circle
-                        circle = new _.CirclePrimitive({
-                            center: cartesian,
-                            radius: 0,
-                            asynchronous: false,
-                            material: options.material,
-                        });
-                        primitives.add(circle);
-                        markers = new _.BillboardGroup(_self, defaultBillboard);
-                        markers.addBillboards([cartesian]);
-                    }
-                    else {
-                        if (typeof options.callback == 'function') {
-                            options.callback(circle.getCenter(), circle.getRadius());
-                        }
-                        _self.stopDrawing();
-                    }
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.LEFT_DOWN);
-        mouseHandler.setInputAction(function (movement) {
-            var position = movement.endPosition;
-            if (position != null) {
-                if (circle == null) {
-                    tooltip.showAt(position, '<p>Click to start drawing the circle</p>');
-                }
-                else {
-                    var cartesian = scene.camera.pickEllipsoid(position, ellipsoid);
-                    if (cartesian) {
-                        circle.setRadius(Cesium.Cartesian3.distance(circle.getCenter(), cartesian));
-                        markers.updateBillboardsPositions(cartesian);
-                        tooltip.showAt(position, '<p>Move mouse to change circle radius</p><p>Click again to finish drawing</p>');
-                    }
-                }
-            }
-        }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-    };
-    _.prototype.enhancePrimitives = function () {
-        var drawHelper = this;
-        Cesium.Billboard.prototype.setEditable = function () {
-            if (this._editable) {
-                return;
-            }
-            this._editable = true;
-            var billboard = this;
-            var _self = this;
-            function enableRotation(enable) {
-                drawHelper._scene.screenSpaceCameraController.enableRotate = enable;
-            }
-            setListener(billboard, 'leftDown', function (position) {
-                // TODO - start the drag handlers here
-                // create handlers for mouseOut and leftUp for the billboard and a mouseMove
-                function onDrag(position) {
-                    billboard.position = position;
-                    _self.executeListeners({ name: 'drag', positions: position });
-                }
-                function onDragEnd(position) {
-                    handler.destroy();
-                    enableRotation(true);
-                    _self.executeListeners({ name: 'dragEnd', positions: position });
-                }
-                var handler = new Cesium.ScreenSpaceEventHandler(drawHelper._scene.canvas);
-                handler.setInputAction(function (movement) {
-                    var cartesian = drawHelper._scene.camera.pickEllipsoid(movement.endPosition, ellipsoid);
-                    if (cartesian) {
-                        onDrag(cartesian);
-                    }
-                    else {
-                        onDragEnd(cartesian);
-                    }
-                }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
-                handler.setInputAction(function (movement) {
-                    onDragEnd(drawHelper._scene.camera.pickEllipsoid(movement.position, ellipsoid));
-                }, Cesium.ScreenSpaceEventType.LEFT_UP);
-                enableRotation(false);
-            });
-            enhanceWithListeners(billboard);
-        };
-        function setHighlighted(highlighted) {
-            var scene = drawHelper._scene;
-            // if no change
-            // if already highlighted, the outline polygon will be available
-            if (this._highlighted && this._highlighted == highlighted) {
-                return;
-            }
-            // disable if already in edit mode
-            if (this._editMode === true) {
-                return;
-            }
-            this._highlighted = highlighted;
-            // highlight by creating an outline polygon matching the polygon points
-            if (highlighted) {
-                // make sure all other shapes are not highlighted
-                drawHelper.setHighlighted(this);
-                this._strokeColor = this.strokeColor;
-                this.setStrokeStyle(Cesium.Color.fromCssColorString('white'), this.strokeWidth);
-            }
-            else {
-                if (this._strokeColor) {
-                    this.setStrokeStyle(this._strokeColor, this.strokeWidth);
-                }
-                else {
-                    this.setStrokeStyle(undefined, undefined);
-                }
-            }
-        }
-        function setEditMode(editMode) {
-            // if no change
-            if (this._editMode == editMode) {
-                return;
-            }
-            // make sure all other shapes are not in edit mode before starting the editing of this shape
-            drawHelper.disableAllHighlights();
-            // display markers
-            if (editMode) {
-                drawHelper.setEdited(this);
-                var scene = drawHelper._scene;
-                var _self = this;
-                // create the markers and handlers for the editing
-                if (this._markers == null) {
-                    var markers = new _.BillboardGroup(drawHelper, dragBillboard);
-                    var editMarkers = new _.BillboardGroup(drawHelper, dragHalfBillboard);
-                    // function for updating the edit markers around a certain point
-                    function updateHalfMarkers(index, positions) {
-                        // update the half markers before and after the index
-                        var editIndex = index - 1 < 0 ? positions.length - 1 : index - 1;
-                        if (editIndex < editMarkers.countBillboards()) {
-                            editMarkers.getBillboard(editIndex).position = calculateHalfMarkerPosition(editIndex);
-                        }
-                        editIndex = index;
-                        if (editIndex < editMarkers.countBillboards()) {
-                            editMarkers.getBillboard(editIndex).position = calculateHalfMarkerPosition(editIndex);
-                        }
-                    }
-                    function onEdited() {
-                        _self.executeListeners({
-                            name: 'onEdited',
-                            positions: _self.positions,
-                        });
-                    }
-                    var handleMarkerChanges = {
-                        dragHandlers: {
-                            onDrag: function (index, position) {
-                                _self.positions[index] = position;
-                                updateHalfMarkers(index, _self.positions);
-                                _self._createPrimitive = true;
-                            },
-                            onDragEnd: function (index, position) {
-                                _self._createPrimitive = true;
-                                onEdited();
-                            },
-                        },
-                        onDoubleClick: function (index) {
-                            if (_self.positions.length < 4) {
-                                return;
-                            }
-                            // remove the point and the corresponding markers
-                            _self.positions.splice(index, 1);
-                            _self._createPrimitive = true;
-                            markers.removeBillboard(index);
-                            editMarkers.removeBillboard(index);
-                            updateHalfMarkers(index, _self.positions);
-                            onEdited();
-                        },
-                        tooltip: function () {
-                            if (_self.positions.length > 3) {
-                                return 'Double click to remove this point';
-                            }
-                        },
-                    };
-                    // add billboards and keep an ordered list of them for the polygon edges
-                    markers.addBillboards(_self.positions, handleMarkerChanges);
-                    this._markers = markers;
-                    function calculateHalfMarkerPosition(index) {
-                        var positions = _self.positions;
-                        return ellipsoid.cartographicToCartesian(new Cesium.EllipsoidGeodesic(ellipsoid.cartesianToCartographic(positions[index]), ellipsoid.cartesianToCartographic(positions[index < positions.length - 1 ? index + 1 : 0])).interpolateUsingFraction(0.5));
-                    }
-                    var halfPositions = [];
-                    var index = 0;
-                    var length = _self.positions.length + (this.isPolygon ? 0 : -1);
-                    for (; index < length; index++) {
-                        halfPositions.push(calculateHalfMarkerPosition(index));
-                    }
-                    var handleEditMarkerChanges = {
-                        dragHandlers: {
-                            onDragStart: function (index, position) {
-                                // add a new position to the polygon but not a new marker yet
-                                this.index = index + 1;
-                                _self.positions.splice(this.index, 0, position);
-                                _self._createPrimitive = true;
-                            },
-                            onDrag: function (index, position) {
-                                _self.positions[this.index] = position;
-                                _self._createPrimitive = true;
-                            },
-                            onDragEnd: function (index, position) {
-                                // create new sets of makers for editing
-                                markers.insertBillboard(this.index, position, handleMarkerChanges);
-                                editMarkers.getBillboard(this.index - 1).position = calculateHalfMarkerPosition(this.index - 1);
-                                editMarkers.insertBillboard(this.index, calculateHalfMarkerPosition(this.index), handleEditMarkerChanges);
-                                _self._createPrimitive = true;
-                                onEdited();
-                            },
-                        },
-                        tooltip: function () {
-                            return 'Drag to create a new point';
-                        },
-                    };
-                    editMarkers.addBillboards(halfPositions, handleEditMarkerChanges);
-                    this._editMarkers = editMarkers;
-                    // add a handler for clicking in the globe
-                    this._globeClickhandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-                    this._globeClickhandler.setInputAction(function (movement) {
-                        var pickedObject = scene.pick(movement.position);
-                        if (!(pickedObject && pickedObject.primitive)) {
-                            _self.setEditMode(false);
-                        }
-                    }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-                    // set on top of the polygon
-                    markers.setOnTop();
-                    editMarkers.setOnTop();
-                }
-                this._editMode = true;
-            }
-            else {
-                if (this._markers != null) {
-                    this._markers.remove();
-                    this._editMarkers.remove();
-                    this._markers = null;
-                    this._editMarkers = null;
-                    this._globeClickhandler.destroy();
-                }
-                this._editMode = false;
-            }
-        }
-        DrawHelper.PolylinePrimitive.prototype.setEditable = function () {
-            if (this.setEditMode) {
-                return;
-            }
-            var polyline = this;
-            polyline.isPolygon = false;
-            polyline.asynchronous = false;
-            drawHelper.registerEditableShape(polyline);
-            polyline.setEditMode = setEditMode;
-            var originalWidth = this.width;
-            polyline.setHighlighted = function (highlighted) {
-                // disable if already in edit mode
-                if (this._editMode === true) {
-                    return;
-                }
-                if (highlighted) {
-                    drawHelper.setHighlighted(this);
-                    this.setWidth(originalWidth * 2);
-                }
-                else {
-                    this.setWidth(originalWidth);
-                }
-            };
-            polyline.getExtent = function () {
-                return Cesium.Extent.fromCartographicArray(ellipsoid.cartesianArrayToCartographicArray(this.positions));
-            };
-            enhanceWithListeners(polyline);
-            polyline.setEditMode(false);
-        };
-        DrawHelper.PolygonPrimitive.prototype.setEditable = function () {
-            var polygon = this;
-            polygon.asynchronous = false;
-            var scene = drawHelper._scene;
-            drawHelper.registerEditableShape(polygon);
-            polygon.setEditMode = setEditMode;
-            polygon.setHighlighted = setHighlighted;
-            enhanceWithListeners(polygon);
-            polygon.setEditMode(false);
-        };
-        DrawHelper.ExtentPrimitive.prototype.setEditable = function () {
-            if (this.setEditMode) {
-                return;
-            }
-            var extent = this;
-            var scene = drawHelper._scene;
-            drawHelper.registerEditableShape(extent);
-            extent.asynchronous = false;
-            extent.setEditMode = function (editMode) {
-                // if no change
-                if (this._editMode == editMode) {
-                    return;
-                }
-                drawHelper.disableAllHighlights();
-                // display markers
-                if (editMode) {
-                    // make sure all other shapes are not in edit mode before starting the editing of this shape
-                    drawHelper.setEdited(this);
-                    // create the markers and handlers for the editing
-                    if (this._markers == null) {
-                        var markers = new _.BillboardGroup(drawHelper, dragBillboard);
-                        function onEdited() {
-                            extent.executeListeners({
-                                name: 'onEdited',
-                                extent: extent.extent,
-                            });
-                        }
-                        var handleMarkerChanges = {
-                            dragHandlers: {
-                                onDrag: function (index, position) {
-                                    var corner = markers.getBillboard((index + 2) % 4).position;
-                                    extent.setExtent(getExtent(ellipsoid.cartesianToCartographic(corner), ellipsoid.cartesianToCartographic(position)));
-                                    markers.updateBillboardsPositions(getExtentCorners(extent.extent));
-                                },
-                                onDragEnd: function (index, position) {
-                                    onEdited();
-                                },
-                            },
-                            tooltip: function () {
-                                return 'Drag to change the corners of this extent';
-                            },
-                        };
-                        markers.addBillboards(getExtentCorners(extent.extent), handleMarkerChanges);
-                        this._markers = markers;
-                        // add a handler for clicking in the globe
-                        this._globeClickhandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-                        this._globeClickhandler.setInputAction(function (movement) {
-                            var pickedObject = scene.pick(movement.position);
-                            // disable edit if pickedobject is different or not an object
-                            if (!(pickedObject &&
-                                !pickedObject.isDestroyed() &&
-                                pickedObject.primitive)) {
-                                extent.setEditMode(false);
-                            }
-                        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-                        // set on top of the polygon
-                        markers.setOnTop();
-                    }
-                    this._editMode = true;
-                }
-                else {
-                    if (this._markers != null) {
-                        this._markers.remove();
-                        this._markers = null;
-                        this._globeClickhandler.destroy();
-                    }
-                    this._editMode = false;
-                }
-            };
-            extent.setHighlighted = setHighlighted;
-            enhanceWithListeners(extent);
-            extent.setEditMode(false);
-        };
-        _.EllipsePrimitive.prototype.setEditable = function () {
-            if (this.setEditMode) {
-                return;
-            }
-            var ellipse = this;
-            var scene = drawHelper._scene;
-            ellipse.asynchronous = false;
-            drawHelper.registerEditableShape(ellipse);
-            ellipse.setEditMode = function (editMode) {
-                // if no change
-                if (this._editMode == editMode) {
-                    return;
-                }
-                drawHelper.disableAllHighlights();
-                // display markers
-                if (editMode) {
-                    // make sure all other shapes are not in edit mode before starting the editing of this shape
-                    drawHelper.setEdited(this);
-                    var _self = this;
-                    // create the markers and handlers for the editing
-                    if (this._markers == null) {
-                        var markers = new _.BillboardGroup(drawHelper, dragBillboard);
-                        function getMarkerPositions() {
-                            return Cesium.Shapes.computeEllipseBoundary(ellipsoid, ellipse.getCenter(), ellipse.getSemiMajorAxis(), ellipse.getSemiMinorAxis(), ellipse.getRotation() + Math.PI / 2, Math.PI / 2.0).splice(0, 4);
-                        }
-                        function onEdited() {
-                            ellipse.executeListeners({
-                                name: 'onEdited',
-                                center: ellipse.getCenter(),
-                                semiMajorAxis: ellipse.getSemiMajorAxis(),
-                                semiMinorAxis: ellipse.getSemiMinorAxis(),
-                                rotation: 0,
-                            });
-                        }
-                        var handleMarkerChanges = {
-                            dragHandlers: {
-                                onDrag: function (index, position) {
-                                    var distance = Cesium.Cartesian3.distance(ellipse.getCenter(), position);
-                                    if (index % 2 == 0) {
-                                        ellipse.setSemiMajorAxis(distance);
-                                    }
-                                    else {
-                                        ellipse.setSemiMinorAxis(distance);
-                                    }
-                                    markers.updateBillboardsPositions(getMarkerPositions());
-                                },
-                                onDragEnd: function (index, position) {
-                                    onEdited();
-                                },
-                            },
-                            tooltip: function () {
-                                return 'Drag to change the excentricity and radius';
-                            },
-                        };
-                        markers.addBillboards(getMarkerPositions(), handleMarkerChanges);
-                        this._markers = markers;
-                        // add a handler for clicking in the globe
-                        this._globeClickhandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-                        this._globeClickhandler.setInputAction(function (movement) {
-                            var pickedObject = scene.pick(movement.position);
-                            if (!(pickedObject && pickedObject.primitive)) {
-                                _self.setEditMode(false);
-                            }
-                        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-                        // set on top of the polygon
-                        markers.setOnTop();
-                    }
-                    this._editMode = true;
-                }
-                else {
-                    if (this._markers != null) {
-                        this._markers.remove();
-                        this._markers = null;
-                        this._globeClickhandler.destroy();
-                    }
-                    this._editMode = false;
-                }
-            };
-            ellipse.setHighlighted = setHighlighted;
-            enhanceWithListeners(ellipse);
-            ellipse.setEditMode(false);
-        };
-        _.CirclePrimitive.prototype.getCircleCartesianCoordinates = function (granularity) {
-            var geometry = Cesium.CircleOutlineGeometry.createGeometry(new Cesium.CircleOutlineGeometry({
-                ellipsoid: ellipsoid,
-                center: this.getCenter(),
-                radius: this.getRadius(),
-                granularity: granularity,
-            }));
-            var count = 0, value, values = [];
-            for (; count < geometry.attributes.position.values.length; count += 3) {
-                value = geometry.attributes.position.values;
-                values.push(new Cesium.Cartesian3(value[count], value[count + 1], value[count + 2]));
-            }
-            return values;
-        };
-        _.CirclePrimitive.prototype.setEditable = function () {
-            if (this.setEditMode) {
-                return;
-            }
-            var circle = this;
-            var scene = drawHelper._scene;
-            circle.asynchronous = false;
-            drawHelper.registerEditableShape(circle);
-            circle.setEditMode = function (editMode) {
-                // if no change
-                if (this._editMode == editMode) {
-                    return;
-                }
-                drawHelper.disableAllHighlights();
-                // display markers
-                if (editMode) {
-                    // make sure all other shapes are not in edit mode before starting the editing of this shape
-                    drawHelper.setEdited(this);
-                    var _self = this;
-                    // create the markers and handlers for the editing
-                    if (this._markers == null) {
-                        var markers = new _.BillboardGroup(drawHelper, dragBillboard);
-                        function getMarkerPositions() {
-                            return _self.getCircleCartesianCoordinates(Cesium.Math.PI_OVER_TWO);
-                        }
-                        function onEdited() {
-                            circle.executeListeners({
-                                name: 'onEdited',
-                                center: circle.getCenter(),
-                                radius: circle.getRadius(),
-                            });
-                        }
-                        var handleMarkerChanges = {
-                            dragHandlers: {
-                                onDrag: function (index, position) {
-                                    circle.setRadius(Cesium.Cartesian3.distance(circle.getCenter(), position));
-                                    markers.updateBillboardsPositions(getMarkerPositions());
-                                },
-                                onDragEnd: function (index, position) {
-                                    onEdited();
-                                },
-                            },
-                            tooltip: function () {
-                                return 'Drag to change the radius';
-                            },
-                        };
-                        markers.addBillboards(getMarkerPositions(), handleMarkerChanges);
-                        this._markers = markers;
-                        // add a handler for clicking in the globe
-                        this._globeClickhandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-                        this._globeClickhandler.setInputAction(function (movement) {
-                            var pickedObject = scene.pick(movement.position);
-                            if (!(pickedObject && pickedObject.primitive)) {
-                                _self.setEditMode(false);
-                            }
-                        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
-                        // set on top of the polygon
-                        markers.setOnTop();
-                    }
-                    this._editMode = true;
-                }
-                else {
-                    if (this._markers != null) {
-                        this._markers.remove();
-                        this._markers = null;
-                        this._globeClickhandler.destroy();
-                    }
-                    this._editMode = false;
-                }
-            };
-            circle.setHighlighted = setHighlighted;
-            enhanceWithListeners(circle);
-            circle.setEditMode(false);
-        };
-    };
-    _.DrawHelperWidget = (function () {
-        // constructor
-        function _(drawHelper, options) {
-            // container must be specified
-            if (!Cesium.defined(options.container)) {
-                throw new Cesium.DeveloperError('Container is required');
-            }
-            var drawOptions = {
-                markerIcon: './assets/img/glyphicons_242_google_maps.png',
-                polylineIcon: './assets/img/glyphicons_097_vector_path_line.png',
-                polygonIcon: './assets/img/glyphicons_096_vector_path_polygon.png',
-                circleIcon: './assets/img/glyphicons_095_vector_path_circle.png',
-                extentIcon: './assets/img/glyphicons_094_vector_path_square.png',
-                clearIcon: './assets/img/glyphicons_067_cleaning.png',
-                polylineDrawingOptions: defaultPolylineOptions,
-                polygonDrawingOptions: defaultPolygonOptions,
-                extentDrawingOptions: defaultExtentOptions,
-                circleDrawingOptions: defaultCircleOptions,
-            };
-            fillOptions(options, drawOptions);
-            var _self = this;
-            var toolbar = document.createElement('DIV');
-            toolbar.className = 'toolbar';
-            options.container.appendChild(toolbar);
-            function addIcon(id, url, title, callback) {
-                var div = document.createElement('DIV');
-                div.className = 'button';
-                div.title = title;
-                toolbar.appendChild(div);
-                div.onclick = callback;
-                var span = document.createElement('SPAN');
-                div.appendChild(span);
-                var image = document.createElement('IMG');
-                image.src = url;
-                span.appendChild(image);
-                return div;
-            }
-            var scene = drawHelper._scene;
-            addIcon('marker', options.markerIcon, 'Click to start drawing a 2D marker', function () {
-                drawHelper.startDrawingMarker({
-                    callback: function (position) {
-                        _self.executeListeners({
-                            name: 'markerCreated',
-                            position: position,
-                        });
-                    },
-                });
-            });
-            addIcon('polyline', options.polylineIcon, 'Click to start drawing a 2D polyline', function () {
-                drawHelper.startDrawingPolyline({
-                    callback: function (positions) {
-                        _self.executeListeners({
-                            name: 'polylineCreated',
-                            positions: positions,
-                        });
-                    },
-                });
-            });
-            addIcon('polygon', options.polygonIcon, 'Click to start drawing a 2D polygon', function () {
-                drawHelper.startDrawingPolygon({
-                    callback: function (positions) {
-                        _self.executeListeners({
-                            name: 'polygonCreated',
-                            positions: positions,
-                        });
-                    },
-                });
-            });
-            addIcon('extent', options.extentIcon, 'Click to start drawing an Extent', function () {
-                drawHelper.startDrawingExtent({
-                    callback: function (extent) {
-                        _self.executeListeners({ name: 'extentCreated', extent: extent });
-                    },
-                });
-            });
-            addIcon('circle', options.circleIcon, 'Click to start drawing a Circle', function () {
-                drawHelper.startDrawingCircle({
-                    callback: function (center, radius) {
-                        _self.executeListeners({
-                            name: 'circleCreated',
-                            center: center,
-                            radius: radius,
-                        });
-                    },
-                });
-            });
-            // add a clear button at the end
-            // add a divider first
-            var div = document.createElement('DIV');
-            div.className = 'divider';
-            toolbar.appendChild(div);
-            addIcon('clear', options.clearIcon, 'Remove all primitives', function () {
-                scene.primitives.removeAll();
-            });
-            enhanceWithListeners(this);
-        }
-        return _;
-    })();
-    _.prototype.addToolbar = function (container, options) {
-        options = copyOptions(options, { container: container });
-        return new _.DrawHelperWidget(this, options);
-    };
-    function getExtent(mn, mx) {
-        var e = new Cesium.Rectangle();
-        // Re-order so west < east and south < north
-        e.west = Math.min(mn.longitude, mx.longitude);
-        e.east = Math.max(mn.longitude, mx.longitude);
-        e.south = Math.min(mn.latitude, mx.latitude);
-        e.north = Math.max(mn.latitude, mx.latitude);
-        // Check for approx equal (shouldn't require abs due to re-order)
-        var epsilon = Cesium.Math.EPSILON7;
-        if (e.east - e.west < epsilon) {
-            e.east += epsilon * 2.0;
-        }
-        if (e.north - e.south < epsilon) {
-            e.north += epsilon * 2.0;
-        }
-        return e;
-    }
-    function createTooltip(frameDiv) {
-        var tooltip = function (frameDiv) {
-            var div = document.createElement('DIV');
-            div.className = 'twipsy right';
-            var arrow = document.createElement('DIV');
-            arrow.className = 'twipsy-arrow';
-            div.appendChild(arrow);
-            var title = document.createElement('DIV');
-            title.className = 'twipsy-inner';
-            div.appendChild(title);
-            this._div = div;
-            this._title = title;
-            // add to frame div and display coordinates
-            frameDiv.appendChild(div);
-        };
-        tooltip.prototype.setVisible = function (visible) {
-            this._div.style.display = visible ? 'block' : 'none';
-        };
-        tooltip.prototype.showAt = function (position, message) {
-            if (position && message) {
-                this.setVisible(true);
-                this._title.innerHTML = message;
-                this._div.style.left = position.x + 10 + 'px';
-                this._div.style.top = position.y - this._div.clientHeight / 2 + 'px';
-            }
-        };
-        return new tooltip(frameDiv);
-    }
-    function getDisplayLatLngString(cartographic, precision) {
-        return (cartographic.longitude.toFixed(precision || 3) +
-            ', ' +
-            cartographic.latitude.toFixed(precision || 3));
-    }
-    function clone(from, to) {
-        if (from == null || typeof from != 'object')
-            return from;
-        if (from.constructor != Object && from.constructor != Array)
-            return from;
-        if (from.constructor == Date ||
-            from.constructor == RegExp ||
-            from.constructor == Function ||
-            from.constructor == String ||
-            from.constructor == Number ||
-            from.constructor == Boolean)
-            return new from.constructor(from);
-        to = to || new from.constructor();
-        for (var name in from) {
-            to[name] =
-                typeof to[name] == 'undefined' ? clone(from[name], null) : to[name];
-        }
-        return to;
-    }
-    function fillOptions(options, defaultOptions) {
-        options = options || {};
-        var option;
-        for (option in defaultOptions) {
-            if (options[option] === undefined) {
-                options[option] = clone(defaultOptions[option]);
-            }
-        }
-    }
-    // shallow copy
-    function copyOptions(options, defaultOptions) {
-        var newOptions = clone(options), option;
-        for (option in defaultOptions) {
-            if (newOptions[option] === undefined) {
-                newOptions[option] = clone(defaultOptions[option]);
-            }
-        }
-        return newOptions;
-    }
-    function setListener(primitive, type, callback) {
-        primitive[type] = callback;
-    }
-    function enhanceWithListeners(element) {
-        element._listeners = {};
-        element.addListener = function (name, callback) {
-            this._listeners[name] = this._listeners[name] || [];
-            this._listeners[name].push(callback);
-            return this._listeners[name].length;
-        };
-        element.executeListeners = function (event, defaultCallback) {
-            if (this._listeners[event.name] &&
-                this._listeners[event.name].length > 0) {
-                var index = 0;
-                for (; index < this._listeners[event.name].length; index++) {
-                    this._listeners[event.name][index](event);
-                }
-            }
-            else {
-                if (defaultCallback) {
-                    defaultCallback(event);
-                }
-            }
-        };
-    }
-    return _;
-})();
-exports.DrawHelper = DrawHelper;
-//# sourceMappingURL=drawHelper.js.map