Простой пример ArcGIS, динамически отображающий маркер

Мне трудно добавить простой интерактивный маркер в ArcGIS, карту исключительно с использованием JavaScript. Все примеры ArcGIS, кажется, получили свою метку и соответствующая всплывающая информация с сервера. Как я могу добиться того же результата с помощью ArcGIS, что и приведенный ниже пример кода Google Maps?

<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>

person Langdon    schedule 12.03.2012    source источник
comment
У меня работает нормально: jsfiddle.net/j08691/DLasJ. Я получу награду ;)   -  person j08691    schedule 14.03.2012
comment
@ j08691 j08691 вы поместили мой код в jsfiddle ... вы не использовали ArcGIS, как я задал вопрос.   -  person Langdon    schedule 15.03.2012


Ответы (2)


Попробуй это:

  1. Создайте Point для своей долготы и широты
  2. Преобразование точки в пространственную привязку Web Mercator, если это необходимо
  3. Создайте PictureMarkerSymbol для пользовательского маркера изображения
  4. Создайте Graphic, используя точку и символ
  5. Создайте GraphicsLayer
  6. Добавьте графику к графическому слою
  7. Добавьте графический слой на карту
  8. Добавьте пользовательский прослушиватель событий onClick на свой слой.

Некоторый эквивалентный код:

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);

В прослушивателе событий вы можете открыть пользовательский infoWindow или что угодно:

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

Измените «marker.png» и 32x32, чтобы использовать собственное изображение и размеры маркера.

person Juan Mellado    schedule 15.03.2012
comment
Спасибо! Возникли проблемы с esri.geometry.Point. Похоже, что он не принимает мою широту/долготу и всегда будет ставить маркер на широту: 0 и долготу: 0. Пример здесь: jsfiddle.net/v8EEy - person Langdon; 15.03.2012
comment
@Langdon Ваша карта использует пространственную привязку Web Mercator. Используйте esri.geometry.geographicToWebMercator для преобразования (долгота, широта). Я обновил ответ. - person Juan Mellado; 15.03.2012

Попробуйте разместить значок изображения в любом месте экрана X Y, используя позиционирование CSS, а затем просто поместите обработчик onClick внутри фактического тега DIV или IMG. Попробуйте поэкспериментировать с комбинацией относительных и абсолютных значений, чтобы получить правильный результат.

div#header {
position: relative;
}

img#headimg {
position: absolute;
left: whatever you like
top: whatever you like
}
person Josh P    schedule 14.03.2012
comment
Я не уверен, что вы поняли мой вопрос. У меня есть широта/долгота, и мне нужно динамически разместить значок на карте ArcGIS с помощью JavaScript. - person Langdon; 15.03.2012