How to plot a marker point in esri arcgis map using react js

lijoshabraham

 

I am trying to add a point/line in arcgis map using react JS. Now my map is working fine. I'm referring https://developers.arcgis.com/javascript/latest/add-a-point-line-and-polygon/#run-the-app link. But they are using ARCGIS API for JavaScript for adding points on the map with Graphic and GraphicsLayer. I've followed this method for displaying the map https://www.esri.com/about/newsroom/arcuser/react-arcgis/ I'm trying to add Graphic and Graphics layer module for adding points on the map. Could anyone help me how to add Graphic and GraphicsLayer? Here is my app.js code looks like..

import WebMap from "esri/WebMap";

import MapView from "esri/views/MapView";

import Search from "esri/widgets/Search";

import FeatureLayer from "esri/layers/FeatureLayer";

const noop = () => {};

export const webmap = new WebMap({

portalItem: {

id: "974c6641665a42bf8a57da08e607bb6f"

}

});

export const view = new MapView({

map: webmap

});

export const search = new Search({ view });

view.ui.add(search, "top-right");

export const initialize = (container) => {

view.container = container;

view

.when()

.then(_ => {

console.log("Map and View are ready");

})

.catch(noop);

return () => {

view.container = null;

};

};

Thank you. 

Screen Shot 2021-04-15 at 11.43.15 PM copy.png

FieldCalculator.JPG

ForrestLin_1-1714583589226.png

ReneRubalcava

Routing and directions are premium services. You can use an API key with your free developer account.

https://developers.arcgis.com/documentation/mapping-apis-and-services/security/api-keys/