Bewegliches ArcGIS-Popup-Fenster (Dojo) identifizieren

8

Ich versuche, ein Popup-Fenster zu erhalten, das einen Ort identifiziert, der verschoben werden soll. Mein Code ähnelt dem API-Beispiel:

var popupOptions = {
    fillSymbol: new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID,
                new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,
                new dojo.Color([255, 0, 0]), 2),
                new dojo.Color([255, 255, 0, 0.25]))
}

var popup = new esri.dijit.Popup(popupOptions, dojo.create("div"));

map = new esri.Map("map", {
    infoWindow:popup,
    extent: initExtent
});

Ich kann anscheinend nirgendwo etwas finden, das es mir ermöglicht, dieses Popup-Infofenster beweglich zu machen (ich habe versucht, dojo.dnd.moveable zu implementieren).

Ich habe erfolglos versucht:

function makeMoveable(node){
    var dnd = new dojo.dnd.Moveable(dojo.byId(node));
}
makeMoveable(popup);

Hat jemand einen Vorschlag?

javascript arcgis-javascript-api popup dojo motoxer4533
quelle
2
Wenn ich du wäre, würde ich keine dijitvon ESRI hergestellten verwenden. Ich arbeite viel mit esri JS api und habe darin viele Fehler gefunden. Und IMO sind diese Module nicht sehr konfigurierbar.
Krystian
1
Ich habe vorher darüber nachgedacht, etwas Ähnliches zu tun, aber das Popup beweglich zu machen, ist nur ein Teil des Problems - das Fenster zeigt auf den Ort, auf den es verweist, indem eines dieser Bilder verwendet wird: serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/ dijit /… Wenn Sie nicht in ein ziemlich heikles Problem geraten möchten, müssen Sie mit dem Popup leben, das nicht mehr auf den richtigen Ort zeigt
tomfumb

Antworten:

6

Dieser Blog bietet ein hervorragendes Beispiel dafür, wie Sie das Fenster mit dojo ziehbar machen und den Pfeil ausblenden können: https://gavinr.com/2015/04/13/arcgis-javascript-draggable-infowindow

Hier ist das wichtigste Javascript-Snippet:

require([
    'esri/arcgis/utils',
    'dojo/dnd/Moveable',
    'dojo/query',
    'dojo/on',
    'dojo/dom-class'
], function (
    arcgisUtils,
    Moveable,
    query,
    on,
    domClass
) {
    var webMapItemID = "fe0827dfea2441f5b206b0e2c37b79cd";
    arcgisUtils.createMap(webMapItemID, "map", {}).then(function(response) {
        var map = response.map;
        var handle = query(".title", map.infoWindow.domNode)[0];
        var dnd = new Moveable(map.infoWindow.domNode, {
            handle: handle
        });

        // when the infoWindow is moved, hide the arrow:
        on(dnd, 'FirstMove', function() {
            // hide pointer and outerpointer (used depending on where the pointer is shown)
            var arrowNode =  query(".outerPointer", map.infoWindow.domNode)[0];
            domClass.add(arrowNode, "hidden");

            var arrowNode =  query(".pointer", map.infoWindow.domNode)[0];
            domClass.add(arrowNode, "hidden");
        }.bind(this));
    });
});
Chris
quelle
3

Fügen Sie Ihrem HTML-Code ein div mit der ID identityDiv hinzu und ändern Sie Ihr Javascript

var popup = new esri.dijit.Popup({popupOptions}, "identifyDiv");

map = new esri.Map("map", {
    infoWindow:popup,
    extent: initExtent
});

makeMoveable("identifyDiv");
tchapo
quelle
0

Aufgrund von Kommentaren zu meiner Frage habe ich beschlossen, diese Box nicht beweglich zu machen und das Schließsymbol für die Benutzer beizubehalten.

motoxer4533
quelle