Esempio semplice di ArcGIS che riproduce dinamicamente un marker

Question

Ho difficoltà a cercare di aggiungere un semplice indicatore selezionabile a un ArcGIS, mappare semplicemente utilizzando JavaScript. Tutti gli ArcGIS Samples sembrano ottenere il loro indicatore e le relative informazioni popup dal server. Come posso ottenere lo stesso risultato con ArcGIS come questo codice di esempio di Google Maps di seguito?

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<div id="map" style="width: 500px; height: 500px;"></div> 
<script type="text/javascript"> 
    window.onload = function() { 
     var myOptions = { 
      zoom: 2, 
      center: new google.maps.LatLng(40, -75), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById("map"), myOptions); 

     var icon = new google.maps.MarkerImage("http://cinnamonthoughts.org/wp-content/uploads/2010/01/Custom-Marker-Avatar.png"); 

     var markerOptions = { 
      icon: icon, 
      map: map, 
      position: new google.maps.LatLng(37.7699298, -122.4469157), 
     }; 

     var marker = new google.maps.Marker(markerOptions); 

     google.maps.event.addListener(marker, 'click', function() { 
      var infoWindow = new google.maps.InfoWindow(); 
      infoWindow.setContent("hello world"); 
      infoWindow.open(map, marker); 
     }); 
    }; 
</script> 

Answer 1

Prova questo:

1. Creare un Point per voi longitudine e la latitudine
2. convertire il punto in Web Mercatore riferimento spaziale, se è necessario
3. Creare un PictureMarkerSymbol per voi marcatore un'immagine personalizzata
4. Creare un Graphic utilizzando il punto e il simbolo
5. Creare un GraphicsLayer
6. aggiungere l'immagine al livello di grafica
7. aggiungere il layer grafico alla mappa
8. Aggiungere un costume onClick listener di eventi al tuo livello

Alcuni codice equivalente:

var point = new esri.geometry.Point(longitude, latitude); 
point = esri.geometry.geographicToWebMercator(point); 
var symbol = new esri.symbol.PictureMarkerSymbol("marker.png", 32, 32); 
var graphic = new esri.Graphic(point, symbol); 
var layer = new esri.layers.GraphicsLayer(); 
layer.add(graphic); 
map.addLayer(layer); 
dojo.connect(layer, "onClick", onClick); 

Sul listener di eventi è possibile aprire un numero personalizzato infoWindow o quello che preferisci:

function onClick(event) { 
    map.infoWindow(...) 
... 

Modificare "marker.png" e 32x32 per utilizzare l'immagine e le dimensioni dell'indicatore personalizzato.

Answer 2

provare a posizionare la vostra icona immagine in qualsiasi punto dello schermo X Y utilizzando il posizionamento CSS poi basta mettere il gestore onclick all'interno del DIV reale o tag IMG. Prova a giocare con la combinazione relativa vs. assoluta per farlo nel modo giusto.

div#header { 
position: relative; 
} 

img#headimg { 
position: absolute; 
left: whatever you like 
top: whatever you like 
}