ArcGIS Moveable Identify Popup Window (Dojo)

8

Saya mencoba untuk mendapatkan jendela sembulan yang mengidentifikasi lokasi yang dapat dipindahkan. Kode saya mirip dengan contoh API:

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

Sepertinya saya tidak dapat menemukan tempat yang memungkinkan saya membuat infowindow popup yang dapat dipindahkan itu (sedang berpikir untuk mencoba mengimplementasikan dojo.dnd.moveable).

Saya sudah mencoba, tanpa hasil:

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

Adakah yang punya saran?

motoxer4533
sumber
2
Jika saya jadi Anda, saya tidak akan menggunakan yang dijitdibuat oleh ESRI. Saya banyak bekerja dengan esri JS api dan saya menemukan banyak bug di dalamnya. Dan IMO modul-modul itu sangat tidak dapat dikonfigurasi.
Krystian
1
Saya sebelumnya berpikir untuk melakukan hal yang serupa, tetapi membuat popup yang dapat dipindahkan hanya bagian dari masalah - jendela menunjuk ke lokasi yang dirujuknya menggunakan salah satu gambar ini: serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/ dijit /… Kecuali jika Anda ingin masuk ke masalah yang agak lengket Anda harus hidup dengan popup tidak lagi menunjuk ke lokasi yang benar
tomfumb

Jawaban:

6

Blog ini memiliki contoh yang sangat baik tentang cara membuat jendela bisa diseret dan menyembunyikan panah menggunakan dojo: https://gavinr.com/2015/04/13/arcgis-javascript-draggable-infowindow

Berikut cuplikan kunci javascript:

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

Tambahkan div dengan id identDiv ke kode html Anda dan ubah javascript Anda menjadi

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

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

makeMoveable("identifyDiv");
tchapo
sumber
0

Berdasarkan komentar pada pertanyaan saya, saya memutuskan untuk tidak membuat kotak ini dapat dipindahkan dan menjaga ikon tutup untuk pengguna.

motoxer4533
sumber