<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic Re: How to plot a marker point in esri arcgis map using react js in ArcGIS JavaScript Maps SDK Questions</title>
    <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048144#M72594</link>
    <description>&lt;P&gt;There's a number of ways to use the JSAPI with React. Do you have a sample project to look at? Is it class based? Hooks? Importing API in the Component? In Context? Could be a number of issues related to component state or hooks loops.&lt;/P&gt;</description>
    <pubDate>Fri, 16 Apr 2021 15:07:31 GMT</pubDate>
    <dc:creator>ReneRubalcava</dc:creator>
    <dc:date>2021-04-16T15:07:31Z</dc:date>
    <item>
      <title>How to plot a marker point in esri arcgis map using react js</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1047962#M72583</link>
      <description>&lt;DIV class="votecell post-layout--left"&gt;&lt;DIV class="js-voting-container grid jc-center fd-column ai-stretch gs4 fc-black-200"&gt;&lt;DIV class="js-vote-count grid--cell fc-black-500 fs-title grid fd-column ai-center"&gt;&amp;nbsp;&lt;/DIV&gt;&lt;/DIV&gt;&lt;/DIV&gt;&lt;DIV class="postcell post-layout--right"&gt;&lt;DIV class="s-prose js-post-body"&gt;&lt;P&gt;I am trying to add a point/line in arcgis map using react JS. Now my map is working fine. I'm referring&lt;SPAN&gt;&amp;nbsp;&lt;A href="https://developers.arcgis.com/javascript/latest/add-a-point-line-and-polygon/#run-the-app" target="_blank" rel="noopener"&gt;https://developers.arcgis.com/javascript/latest/add-a-point-line-and-polygon/#run-the-app&lt;/A&gt;&lt;/SPAN&gt;&lt;SPAN&gt;&amp;nbsp;&lt;/SPAN&gt;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&amp;nbsp;&lt;A href="https://www.esri.com/about/newsroom/arcuser/react-arcgis/" target="_blank" rel="noopener"&gt;https://www.esri.com/about/newsroom/arcuser/react-arcgis/&lt;/A&gt;&amp;nbsp;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..&lt;/P&gt;&lt;DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;import&lt;/SPAN&gt; &lt;SPAN&gt;WebMap&lt;/SPAN&gt; &lt;SPAN&gt;from&lt;/SPAN&gt; &lt;SPAN&gt;"esri/WebMap"&lt;/SPAN&gt;&lt;SPAN&gt;;&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;import&lt;/SPAN&gt; &lt;SPAN&gt;MapView&lt;/SPAN&gt; &lt;SPAN&gt;from&lt;/SPAN&gt; &lt;SPAN&gt;"esri/views/MapView"&lt;/SPAN&gt;&lt;SPAN&gt;;&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;import&lt;/SPAN&gt; &lt;SPAN&gt;Search&lt;/SPAN&gt; &lt;SPAN&gt;from&lt;/SPAN&gt; &lt;SPAN&gt;"esri/widgets/Search"&lt;/SPAN&gt;&lt;SPAN&gt;;&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;import&lt;/SPAN&gt; &lt;SPAN&gt;FeatureLayer&lt;/SPAN&gt; &lt;SPAN&gt;from&lt;/SPAN&gt; &lt;SPAN&gt;"esri/layers/FeatureLayer"&lt;/SPAN&gt;&lt;SPAN&gt;;&lt;/SPAN&gt;&lt;/DIV&gt;&lt;BR /&gt;&lt;DIV&gt;&lt;SPAN&gt;const&lt;/SPAN&gt; &lt;SPAN&gt;noop&lt;/SPAN&gt;&lt;SPAN&gt; = () &lt;/SPAN&gt;&lt;SPAN&gt;=&amp;gt;&lt;/SPAN&gt;&lt;SPAN&gt; {};&lt;/SPAN&gt;&lt;/DIV&gt;&lt;BR /&gt;&lt;DIV&gt;&lt;SPAN&gt;export&lt;/SPAN&gt; &lt;SPAN&gt;const&lt;/SPAN&gt; &lt;SPAN&gt;webmap&lt;/SPAN&gt;&lt;SPAN&gt; = &lt;/SPAN&gt;&lt;SPAN&gt;new&lt;/SPAN&gt; &lt;SPAN&gt;WebMap&lt;/SPAN&gt;&lt;SPAN&gt;({&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;portalItem&lt;/SPAN&gt;&lt;SPAN&gt;:&lt;/SPAN&gt;&lt;SPAN&gt; {&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;id&lt;/SPAN&gt;&lt;SPAN&gt;:&lt;/SPAN&gt; &lt;SPAN&gt;"974c6641665a42bf8a57da08e607bb6f"&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;}&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;});&lt;/SPAN&gt;&lt;/DIV&gt;&lt;BR /&gt;&lt;DIV&gt;&lt;SPAN&gt;export&lt;/SPAN&gt; &lt;SPAN&gt;const&lt;/SPAN&gt; &lt;SPAN&gt;view&lt;/SPAN&gt;&lt;SPAN&gt; = &lt;/SPAN&gt;&lt;SPAN&gt;new&lt;/SPAN&gt; &lt;SPAN&gt;MapView&lt;/SPAN&gt;&lt;SPAN&gt;({&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;map&lt;/SPAN&gt;&lt;SPAN&gt;:&lt;/SPAN&gt; &lt;SPAN&gt;webmap&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;});&lt;/SPAN&gt;&lt;/DIV&gt;&lt;BR /&gt;&lt;DIV&gt;&lt;SPAN&gt;export&lt;/SPAN&gt; &lt;SPAN&gt;const&lt;/SPAN&gt; &lt;SPAN&gt;search&lt;/SPAN&gt;&lt;SPAN&gt; = &lt;/SPAN&gt;&lt;SPAN&gt;new&lt;/SPAN&gt; &lt;SPAN&gt;Search&lt;/SPAN&gt;&lt;SPAN&gt;({ &lt;/SPAN&gt;&lt;SPAN&gt;view&lt;/SPAN&gt;&lt;SPAN&gt; });&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;view&lt;/SPAN&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;ui&lt;/SPAN&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;add&lt;/SPAN&gt;&lt;SPAN&gt;(&lt;/SPAN&gt;&lt;SPAN&gt;search&lt;/SPAN&gt;&lt;SPAN&gt;, &lt;/SPAN&gt;&lt;SPAN&gt;"top-right"&lt;/SPAN&gt;&lt;SPAN&gt;);&lt;/SPAN&gt;&lt;/DIV&gt;&lt;BR /&gt;&lt;DIV&gt;&lt;SPAN&gt;export&lt;/SPAN&gt; &lt;SPAN&gt;const&lt;/SPAN&gt; &lt;SPAN&gt;initialize&lt;/SPAN&gt;&lt;SPAN&gt; = (&lt;/SPAN&gt;&lt;SPAN&gt;container&lt;/SPAN&gt;&lt;SPAN&gt;) &lt;/SPAN&gt;&lt;SPAN&gt;=&amp;gt;&lt;/SPAN&gt;&lt;SPAN&gt; {&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;view&lt;/SPAN&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;container&lt;/SPAN&gt;&lt;SPAN&gt; = &lt;/SPAN&gt;&lt;SPAN&gt;container&lt;/SPAN&gt;&lt;SPAN&gt;;&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;view&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;when&lt;/SPAN&gt;&lt;SPAN&gt;()&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;then&lt;/SPAN&gt;&lt;SPAN&gt;(&lt;/SPAN&gt;&lt;SPAN&gt;_&lt;/SPAN&gt; &lt;SPAN&gt;=&amp;gt;&lt;/SPAN&gt;&lt;SPAN&gt; {&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;console&lt;/SPAN&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;log&lt;/SPAN&gt;&lt;SPAN&gt;(&lt;/SPAN&gt;&lt;SPAN&gt;"Map and View are ready"&lt;/SPAN&gt;&lt;SPAN&gt;);&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;})&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;catch&lt;/SPAN&gt;&lt;SPAN&gt;(&lt;/SPAN&gt;&lt;SPAN&gt;noop&lt;/SPAN&gt;&lt;SPAN&gt;);&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;return&lt;/SPAN&gt;&lt;SPAN&gt; () &lt;/SPAN&gt;&lt;SPAN&gt;=&amp;gt;&lt;/SPAN&gt;&lt;SPAN&gt; {&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;view&lt;/SPAN&gt;&lt;SPAN&gt;.&lt;/SPAN&gt;&lt;SPAN&gt;container&lt;/SPAN&gt;&lt;SPAN&gt; = &lt;/SPAN&gt;&lt;SPAN&gt;null&lt;/SPAN&gt;&lt;SPAN&gt;;&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;};&lt;/SPAN&gt;&lt;/DIV&gt;&lt;DIV&gt;&lt;SPAN&gt;};&lt;/SPAN&gt;&lt;/DIV&gt;&lt;BR /&gt;&lt;BR /&gt;&lt;/DIV&gt;&lt;P&gt;Thank you.&lt;SPAN&gt;&amp;nbsp;&lt;/SPAN&gt;&lt;/P&gt;&lt;/DIV&gt;&lt;/DIV&gt;</description>
      <pubDate>Fri, 16 Apr 2021 18:26:47 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1047962#M72583</guid>
      <dc:creator>lijoshabraham</dc:creator>
      <dc:date>2021-04-16T18:26:47Z</dc:date>
    </item>
    <item>
      <title>Re: How to plot a marker point in esri arcgis map using react js</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048144#M72594</link>
      <description>&lt;P&gt;There's a number of ways to use the JSAPI with React. Do you have a sample project to look at? Is it class based? Hooks? Importing API in the Component? In Context? Could be a number of issues related to component state or hooks loops.&lt;/P&gt;</description>
      <pubDate>Fri, 16 Apr 2021 15:07:31 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048144#M72594</guid>
      <dc:creator>ReneRubalcava</dc:creator>
      <dc:date>2021-04-16T15:07:31Z</dc:date>
    </item>
    <item>
      <title>Re: How to plot a marker point in esri arcgis map using react js</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048253#M72603</link>
      <description>&lt;P&gt;I'm following this project&amp;nbsp;&lt;A href="https://github.com/odoe/jsapi-react" target="_blank"&gt;https://github.com/odoe/jsapi-react&lt;/A&gt;&lt;/P&gt;</description>
      <pubDate>Fri, 16 Apr 2021 18:28:04 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048253#M72603</guid>
      <dc:creator>lijoshabraham</dc:creator>
      <dc:date>2021-04-16T18:28:04Z</dc:date>
    </item>
    <item>
      <title>Re: How to plot a marker point in esri arcgis map using react js</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048307#M72609</link>
      <description>&lt;P&gt;That demo is really old. The concepts from that blog post still apply. I don't recommend mixing JSAPI imports in React components, but using some sort of layer between the API and your components. Whether that is Context or some other state management.&lt;/P&gt;&lt;P&gt;Here is a more up-to-date demo of using the latest ESM build of the JSAPI with React. It includes a way to add graphics to the map.&lt;/P&gt;&lt;P&gt;&lt;A href="https://github.com/odoe/jsapi-esm-react" target="_blank"&gt;https://github.com/odoe/jsapi-esm-react&lt;/A&gt;&lt;/P&gt;</description>
      <pubDate>Fri, 16 Apr 2021 19:50:53 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048307#M72609</guid>
      <dc:creator>ReneRubalcava</dc:creator>
      <dc:date>2021-04-16T19:50:53Z</dc:date>
    </item>
    <item>
      <title>Re: How to plot a marker point in esri arcgis map using react js</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048929#M72638</link>
      <description>&lt;P&gt;HI,&amp;nbsp;&lt;a href="https://community.esri.com/t5/user/viewprofilepage/user-id/72046"&gt;@RE&lt;/a&gt;&amp;nbsp;I've tried this demo, and&amp;nbsp; I am able to add points on the map. But it is asking me to log in for getting the second point. Is there any way to display the route and directions without login?&lt;/P&gt;</description>
      <pubDate>Tue, 20 Apr 2021 00:08:06 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1048929#M72638</guid>
      <dc:creator>lijoshabraham</dc:creator>
      <dc:date>2021-04-20T00:08:06Z</dc:date>
    </item>
    <item>
      <title>Re: How to plot a marker point in esri arcgis map using react js</title>
      <link>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1049178#M72644</link>
      <description>&lt;P&gt;Routing and directions are premium services. You can use an API key with your free developer account.&lt;/P&gt;&lt;P&gt;&lt;A href="https://developers.arcgis.com/documentation/mapping-apis-and-services/security/api-keys/" target="_blank"&gt;https://developers.arcgis.com/documentation/mapping-apis-and-services/security/api-keys/&lt;/A&gt;&lt;/P&gt;</description>
      <pubDate>Tue, 20 Apr 2021 15:29:07 GMT</pubDate>
      <guid>https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/how-to-plot-a-marker-point-in-esri-arcgis-map/m-p/1049178#M72644</guid>
      <dc:creator>ReneRubalcava</dc:creator>
      <dc:date>2021-04-20T15:29:07Z</dc:date>
    </item>
  </channel>
</rss>

