Advanced Draw

This is an Advanced Draw for ArcGIS Javascript API. Test adding JSON import/export

by Bryan McIntosh

HTML

<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.10/js/dojo/dijit/themes/claro/claro.css">
<script src="http://js.arcgis.com/3.10/"></script>
<link rel="stylesheet" href="http://js.arcgis.com/3.10/js/esri/css/esri.css">
<title>Advanced Draw</title>
<body class="claro">
    <div id="content" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:true" style="width: 100%; height: 100%; margin: 0;">
        <div id="header" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'"> <font size="6">Advanced Draw</font>

        </div>
        <div id="DrawPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'right'">
            <div data-dojo-type="dijit/layout/AccordionContainer">
                <div data-dojo-type="dijit/layout/ContentPane" id="Draw" data-dojo-props="title:'Draw'">
                    <div>Select a shape then draw on map to add graphic</div>
                    <button data-dojo-type="dijit/form/Button">Point</button>
                    <!--<button data-dojo-type="dijit/form/Button">Multi Point</button> -->
                    <!--<button data-dojo-type="dijit/form/Button">Line</button>-->
                    <button data-dojo-type="dijit/form/Button">Polyline</button>
                    <br>
                    <br>
                    <button data-dojo-type="dijit/form/Button">Polygon</button>
                    <button data-dojo-type="dijit/form/Button">Freehand Polyline</button>
                    <button data-dojo-type="dijit/form/Button">Freehand Polygon</button>
                    <div></div>
                    <button data-dojo-type="dijit/form/Button">Arrow</button>
                    <button data-dojo-type="dijit/form/Button">Triangle</button>
                    <button data-dojo-type="dijit/form/Button">Circle</button>
                    <button...

CSS

html, body {
    height: 97%;
    width: 98%;
    margin: 1%;
}
#DrawPane {
    width: 30%;
}

JavaScript

var dojoConfig = {
    packages: [{
        "name": "myModules",
            "location": location.pathname.replace(/\/[^/]+$/, "")
    }]
};
define("myModules/CustomOperation", [
    "dojo/_base/declare", "esri/OperationBase", "esri/toolbars/navigation"], function (declare, OperationBase, Navigation) {
    var customOp = {};
    customOp.Add = declare(OperationBase, {
        label: "Add Graphic",
        constructor: function ( /*graphicsLayer, addedGraphic*/ params) {
            params = params || {};
            if (!params.graphicsLayer) {
                console.error("graphicsLayer is not provided");
                return;
            }
            this.graphicsLayer = params.graphicsLayer;

            if (!params.addedGraphic) {
                console.error("no graphics provided");
                return;
            }
            this._addedGraphic = params.addedGraphic;
        },

        performUndo: function () {
            this.graphicsLayer.remove(this._addedGraphic);
        },

        performRedo: function () {
            this.graphicsLayer.add(this._addedGraphic);
        }
    });
    return customOp;
});
var map, editToolbar, ctxMenuForGraphics, ctxMenuForMap, buttonclick, totalsegmentlength1, uniTest, pointlenMouseEvt, polyMouseEvt, gsrvcPolyComplete;
var selected, currentLocation, PolyArea, measureUnit, symbol, clearRun, draw_mapOnClick, linelenMouseEvt, clickedPointsArr, previousSegmentLength, Unit_Area_C, Unit_Line_C;
var Lat, Long, linelength, selectedTrans, graphic, point2, curcount, distParams, totalsegmentlength, lastdrawnsegmentlength, totalLength;
require([
    "esri/map", "dojo/parser", "dijit/form/CheckBox", "esri/toolbars/draw", "dojo/on", "dojo/dom", "dijit/registry", "dojo/_base/Color", "esri/graphic",
    "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "dijit/form/NumberSpinner", "esri/toolbars/edit", "dojo/number",
    "esri/geometry/jsonUtils", "dijit/Menu",...