topic Having Issue on Adding Point Graphic to The ArcGIS API for JS Map in ArcGIS JavaScript Maps SDK Questions

Having Issue on Adding Point Graphic to The ArcGIS API for JS Map

BruceGreen — Sat, 11 Dec 2021 21:47:01 GMT

Can you please take a look at this JSFiddle and let me know why I am not able to add the Market into the Map? I am getting this error

Uncaught TypeError: Cannot read property 'add' of null

Here is the ode I have

 var graphicsArray = [];
    require(["esri/map",
        "esri/geometry/Geometry",
        "esri/geometry/Point",
        "esri/geometry/Polyline",
        "esri/geometry/Polygon",
        "esri/graphic",
        "esri/symbols/SimpleMarkerSymbol",
        "esri/symbols/SimpleLineSymbol",
        "esri/symbols/SimpleFillSymbol",
        "esri/Color",
        "esri/InfoTemplate",
        "dojo/domReady!",
        "esri/geometry"], function (Map,


    Geometry,
    Point,
    Polyline,
    Polygon,
    Graphic,
    SimpleMarkerSymbol,
    SimpleLineSymbol,
    SimpleFillSymbol,
    Color,
    InfoTemplate) {
        map = new Map("map", {
            basemap: "topo",
            center: [-106.61, 35.1107],
            zoom: 13
        });
        var point = new Point(-106.61, 35.1107);
        var pointSymbol = new SimpleMarkerSymbol();
        var pointAttributes = { city: "Albuquerque", state: "New Mexico" };
        var pointInfoTemplate = new InfoTemplate("Albuquerque");
        var pointGraphic = new Graphic(point, pointSymbol, pointAttributes).setInfoTemplate(pointInfoTemplate);


        graphicsArray.push(pointGraphic);
        for (i = 0; i < graphicsArray.length; ++i) {
            map.graphics.add(graphicsArray);


        }


    });

 html, body, #map {
              height: 100%;
              width: 100%;
              margin: 0;
              padding: 0;
          }
          body {
              background-color: #FFF;
              overflow: hidden;
              font-family:"Trebuchet MS";
          }

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">
    <script src="http://js.arcgis.com/3.14/"></script>
    <div id="map"></div>

[1]: http://jsfiddle.net/Behseini/ady51wrn/

Re: Having Issue on Adding Point Graphic to The ArcGIS API for JS Map

RobertScheitlin__GISP — Sat, 11 Dec 2021 21:47:04 GMT

Behrouz,

The map was not ready yet. Here is the fix to use on map load:

var map;
var graphicsArray = [];
require([
    "esri/map",
    "esri/geometry/Geometry",
    "esri/geometry/Point",
    "esri/geometry/Polyline",
    "esri/geometry/Polygon",
    "esri/graphic",
    "esri/symbols/SimpleMarkerSymbol",
    "esri/symbols/SimpleLineSymbol",
    "esri/symbols/SimpleFillSymbol",
    "esri/Color",
    "esri/InfoTemplate",
    "dojo/on",
    "dojo/domReady!"
], function (
        Map,
        Geometry,
        Point,
        Polyline,
        Polygon,
        Graphic,
        SimpleMarkerSymbol,
        SimpleLineSymbol,
        SimpleFillSymbol,
        Color,
        InfoTemplate,
        on) {
    map = new Map("map", {
        basemap: "topo",
        center: [-106.61, 35.1107],
        zoom: 13
    });
    
    var point = new Point(-106.61, 35.1107);
    var pointSymbol = new SimpleMarkerSymbol();
    var pointAttributes = { city: "Albuquerque", state: "New Mexico" };
    var pointInfoTemplate = new InfoTemplate("Albuquerque");
    var pointGraphic = new Graphic(point, pointSymbol, pointAttributes, pointInfoTemplate);
    graphicsArray.push(pointGraphic);
    map.on("load", function(){
        for (i = 0; i < graphicsArray.length; ++i) {
            map.graphics.add(pointGraphic);//graphicsArray);
        }
    });
});

Re: Having Issue on Adding Point Graphic to The ArcGIS API for JS Map

BruceGreen — Wed, 26 Aug 2015 18:25:55 GMT

Thanks a lot Robert