highlightMarkerSymbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 22, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255,255,0]), 2), new Color([255,255,0,0.5])); var popup = new Popup({ markerSymbol: highlightMarkerSymbol, fillSymbol: new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255,200,0]), 2), new Color([255,255,0,0.50])) }, dojo.create("div")); map = new Map("mapDiv", { infoWindow: popup, basemap: "topo", center: [-92.593, 38.5], zoom: 7 }); Solved! Go to Solution.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<title>testing</title>
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/esri/css/esri.css">
<link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css" />
<style type="text/css">
html, body, #mapDiv {
padding: 0;
margin: 0;
height: 100%;
}
</style>
<script src="http://js.arcgis.com/3.7/"></script>
<script>
require([
"dojo/ready",
"dojo/parser",
"dojo/dom-construct",
"dojo/_base/Color",
"esri/graphic",
"esri/map",
"esri/dijit/Popup",
"esri/geometry/Point",
"esri/symbols/SimpleFillSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/symbols/SimpleMarkerSymbol",
], function(
ready,
parser,
domConstruct,
Color,
Graphic,
Map,
Popup,
Point,
SimpleFillSymbol,
SimpleLineSymbol,
SimpleMarkerSymbol
) {
// Variables
var map;
var highlightMarkerSymbol;
var popup;
// Set up
popup = new Popup({
titleInBody: false
},domConstruct.create("div"));
map = new Map("mapDiv", {
infoWindow: popup,
basemap: "topo",
center: [-92.593, 38.5],
zoom: 7
});
highlightMarkerSymbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 22, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255,255,0]), 2), new Color([255,255,0,0.5]));
ready(function () {
// parse the fully loaded DOM
parser.parse();
//do stuff
map.on("click", function(evt){
// remove old graphics from map
map.graphics.graphics.forEach(function(g){
if(g.visible == true)
map.graphics.remove(g);
});
// create simple symbol
var point = new Point(evt.mapPoint.getLongitude(), evt.mapPoint.getLatitude());
var graphic = new Graphic(point, highlightMarkerSymbol);
// add the graphic and show the popup
map.graphics.add(graphic);
map.infoWindow.setTitle("test");
map.infoWindow.setContent("test");
map.infoWindow.show(point);
});
});
});
</script>
</head>
<body class="claro">
<div id="mapDiv"></div>
</body>
</html>