Follow the steps below.
Check here to see the Red Line shape coordinates. Check here to automatically close the redline polygon when the starting node is clicked. |
The onLoad function of the page body invokes the init() method above, which initializes the map as well as a red-line tool.var mapview; var redline; //the red-lining tool var rlflag=true; var ordflag=false; var mapMoveFlag=false; function init() { document.getElementById("redLineOrdFlag").checked = false; showMap(); redLine(); } function showMap() { var baseURL = "http://"+document.location.host+"/mapviewer"; var mapCenterLon = -122.45; var mapCenterLat = 37.6706; var mapZoom = 4; var mpoint = MVSdoGeometry.createPoint(mapCenterLon,mapCenterLat,8307); mapview = new MVMapView(document.getElementById("map"), baseURL); mapview.addMapTileLayer(new MVMapTileLayer("mvdemo.demo_map")); mapview.setCenter(mpoint); mapview.setZoomLevel(mapZoom); mapview.attachEventListener(MVEvent.RECENTER,checkMapMove); mapview.attachEventListener(MVEvent.MOUSE_CLICK,getRedLineOrd); mapview.display(); } //this method returns a new red-line tool function redLine() { redline = new MVRedlineTool("mvdemo.L.RAMP", "mvdemo.C.RED"); mapview.addRedLineTool(redline); } function checkMapMove() { mapMoveFlag = true; } function getRedLineOrd() { if(mapMoveFlag) { mapMoveFlag = false; return; } if (rlflag && ordflag) alert("Redline coordinates:"+ redline.getOrdinates()+" "); } function showRedLineOrd(item) { ordflag=item.checked; } function setRLFlag(flag) { rlflag=flag; }
The code below shows how this demo invokes various methods on the red-line tool to perform tasks such as displaying a finished shape.<body onload="javascript:init()">
<LI><a href="javascript:redline.init();setRLFlag(true)">Click here to enter red-lining mode</a>...</LI> <LI>When done drawing, <a href="javascript:redline.generateArea();setRLFlag(false)"> click here to generate a red line polygon</a></LI> <LI><a href="javascript:redline.clear();setRLFlag(false)"> Click here to remove the red line polygon</a></LI> <LI>Please go back to step 1 if you would like to draw a new shape on the map.