topic Re: Deeply stuck adding one marker to a map in ArcGIS JavaScript Maps SDK Questions

Deeply stuck adding one marker to a map

KenDeeds — Wed, 28 May 2014 18:13:52 GMT

I've been stuck now for 2 days using the new code syntax ("require" vs "init()"). All I'm trying to do is put one marker on a map. I have an example page here:

http://dev.consensusdev.com/sample_esri_map.html

I have no errors, I can copy and paste the source into the sandbox, it runs, no marker shows up, no errors. I'm hoping I'm missing something really simple. I know doing it the old way with "init()" and "dojo.require" I could add a marker no problem. Any help really appreciated. I agreed to do a local developer meeting on ESRI javascript again tomorrow and really just want to show how to make a map and add one point. Been stuck for hours.

Re: Deeply stuck adding one marker to a map

TimWitt — Wed, 28 May 2014 18:20:46 GMT

Maybe this application I have created helps?

I created two markers in it.

One thing I see is that you are missing "dojo/on" in your require, and the corresponding "on" in your function.

This might help you understanding AMD vs Legacy.

Re: Deeply stuck adding one marker to a map

TimWitt — Sun, 12 Dec 2021 05:28:12 GMT

Try this:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test map with one marker</title>
<link type="text/css" href="style/cp.css" rel="stylesheet" />
<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/claro/claro.css"> 
<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">
<script type="text/javascript" src="http://js.arcgis.com/3.9/"></script>

<script>
<!--//
var icons = new Array();
var coords = {'lat': new Array(), 'lon': new Array()};
var map = '';
var icon = '';

var lat = '43.727294000';
var lon = '-97.977614000';

require([
 "esri/map",
 "esri/geometry/Point",
 "esri/SpatialReference",
 "esri/graphic",
 "dojo/on",
 "esri/symbols/SimpleMarkerSymbol",
 "esri/symbols/PictureMarkerSymbol",
 "esri/symbols/SimpleFillSymbol",
 "dojo/domReady!"
 ], 
 function(Map, Point, SpatialReference, Graphic, on, SimpleMarkerSymbol, PictureMarkerSymbol, SimpleFillSymbol) { 
     map = new Map("idmap", {
   center: [lon, lat],
   zoom: 9,
   basemap: "national-geographic"
  });
  on(map, "load", addGraphic);
  function addGraphic(){
   var symbolb = new PictureMarkerSymbol('http://files.geoconhead.consensusdev.com/portal/GCH3cXr0JLmkVKE3QykW/icons/type/original/vtm891210C58F9ABE062.png', 30, 30); 
   var gpoint = new Point(lon, lat, new SpatialReference({ wkid: 4326 }) );
   var newgraphic = new Graphic(gpoint, symbolb);
   map.graphics.add(newgraphic);
   console.log(newgraphic);
  }
  });
 

//-->
</script>
</head>
<body>
<div id="container">
 <div id="core">
  <div class="column" id="column3">
   <div id="idmap" style="width:500px;height:500px;"></div>
  </div>
  <div class="clearboth"></div>
 </div>
</div>
</body>
</html>

You were also missing "esri/SpatialReference"

Tim

Re: Deeply stuck adding one marker to a map

KenDeeds — Wed, 28 May 2014 19:20:37 GMT

Thank you Tim. My first time initiating the map this way (I've used the old onload method with an init() function) and felt anytime I'm this stuck it's something relatively simple and it was. Thank you again.

Re: Deeply stuck adding one marker to a map

TimWitt — Wed, 28 May 2014 19:23:56 GMT

No problem, don't forget to mark the thread as answered.