topic Re: Drop a random editable polygon with a marker in ArcGIS JavaScript Maps SDK Questions

Drop a random editable polygon with a marker

rsharma — Thu, 02 Apr 2020 11:06:25 GMT

I want to drop a random editable polygon when a marker is dropped , do i need to use different graphics layer to add some random polygon around marker . How to drop some random polygon (of small size)

Re: Drop a random editable polygon with a marker

RobertScheitlin__GISP — Thu, 02 Apr 2020 12:34:58 GMT

Rajni,

Random polygon??? This query lacks so much detail... By random do you mean each polygon is going to have a different polygon shape and be centered on the click point?

Re: Drop a random editable polygon with a marker

rsharma — Thu, 02 Apr 2020 12:38:10 GMT

Hi Robert Scheitlin, GISP‌

random means a small size polygon can be of same shape but can be editable by user OR user can draw a polygon with certain type of marker drop
No its not necessary to be very centered to his marker position.
Issue is it should of different color from basic polygons

Kindly suggest suitable

Re: Drop a random editable polygon with a marker

RobertScheitlin__GISP — Fri, 10 Dec 2021 20:46:00 GMT

Rajni,

This is my suggestion.

...
          //drop marker of point type when evt.state is complete
          else if (evt.state === "complete" && evt.tool === 'point') {
            //clone point graphics deeply
            var cloneGra = evt.graphic.clone();
            //?
            graphicsLayer.remove(evt.graphic);
            //define clone graphics symbol
            cloneGra.symbol = textSymbol;
            // define clonegra  attributes
            cloneGra.attributes = {
              newDevelopment: "new marker",
              state: "new"
            };

            //define popup body here
            var popup_html = '<div class="be-form-wrapper">';
                popup_html += '<div>';
                popup_html += '<textarea cols="4" rows="4" class="form-control b_radius mt-20 write_comment" id="write_comment" name="write_comment" placeholder="Write a comment"></textarea>';
                popup_html += '</div>';
                popup_html += '<div>';
                popup_html += '<button class="btn btn-width" data-url="">Cancel</button>';
                popup_html += '</div>';
                popup_html += '<div>';
                popup_html += '<button class="btn btn-width" data-url="">Save</button>';
                popup_html += '</div>';
                popup_html += '</div>';

            //add content of popup body here
            cloneGra.popupTemplate = {
              title : ' ',
              content: domConstruct.toDom(popup_html)
            };
            //add clone graphics to marker graphics layer
            markerGL.add(cloneGra);

            const polygon = webMercatorUtils.geographicToWebMercator(createGeometry([
              [175.9258624, -37.55590445],
              [175.9258630667, -37.55587745],
              [175.9258671333, -37.5557153],
              [175.92626316670004, -37.5557216],
              [175.92625955, -37.5558657],
              [175.9262584333, -37.5559107333],
              [175.9258624, -37.55590445]
            ]));
            translatePolygon( polygon.centroid, evt.graphic.geometry, polygon);

            validSymbol = createSymbol([255, 255, 255, 0.3], "solid", 2, [
              0, 255, 255
            ]);
            var calc_area = geometryEngine.geodesicArea(polygon, "hectares")
            newDevelopmentGraphic = new Graphic({
              geometry: polygon,
              symbol: validSymbol,
              attributes: {
                newDevelopment: "new store",
                state: "propesed",
                area: calc_area
              }
            });
            graphicsLayer.add(newDevelopmentGraphic);
            }
        } //End addTempGraphics

        function translatePolygon(startPoint, currPoint, polygon){
          let dx = currPoint.x - startPoint.x;
          let dy = currPoint.y - startPoint.y;
          polygon.rings.forEach(ring => {
            if (Array.isArray(ring[0])){
              ring.forEach(coord => {
                coord[0] += dx;
                coord[1] += dy;
              });
            } else {
              ring[0] += dx;
              ring[1] += dy;
            }
          });
        }
...‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Drop a random editable polygon with a marker

rsharma — Tue, 07 Apr 2020 11:03:04 GMT

Hi sir,

I just want to know if it is possible to draw(not drop a polygon) a polygon first by user on click of same add marker button (for different markertype) and when polygon completed a marker appears in center of it automatically??

Re: Drop a random editable polygon with a marker

RobertScheitlin__GISP — Tue, 07 Apr 2020 12:22:30 GMT

Sure currently you already have the code for drawing the polygon. Once the polygon is added to the map in the sketchviewmodel complete method then you use the "centroid" property of the polygon class to get the center point and then just make a graphic from that point class.

Re: Drop a random editable polygon with a marker

rsharma — Wed, 08 Apr 2020 12:49:09 GMT

Sir i don't understand why my marker coming with polygon go back side of polygons after some time, when i was working on it