可動ArcGIS識別ポップアップウィンドウ（Dojo）

8

移動可能な場所を示すポップアップウィンドウを取得しようとしています。私のコードは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
});

私はそのポップアップ情報ウィンドウを移動可能にする場所を見つけることができないようです（dojo.dnd.moveableを実装しようと考えていました）。

私は試みましたが、失敗しました：

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

誰か提案がありますか？

— motoxer4533
ソース

2

私があなただったらdijit、ESRI製のは使用しません。私はesri JS apiを使用して多くの作業を行っていますが、それらに多くのバグを見つけました。そしてIMOこれらのモジュールはあまり設定できません。

— クリスティアン

1

私は以前に同様のことをすることを考えましたが、ポップアップを移動可能にすることは問題の一部にすぎません-ウィンドウはこれらの画像の1つを使用して参照する場所を指します：serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/ dijit /…かなり

— 厄介

6

このブログには、ウィンドウをドラッグ可能にして、dojoを使用して矢印を非表示にする方法の優れた例があります。https：//gavinr.com/2015/04/13/arcgis-javascript-draggable-infowindow

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

— クリス
ソース

3

あなたのhtmlコードにidIdentifyDivのdivを追加し、JavaScriptを次のように変更します

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

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

makeMoveable("identifyDiv");

— チャポ
ソース

0

私の質問へのコメントに基づいて、私はこのボックスを移動可能にせず、ユーザーに閉じるアイコンを保持することにしました。

— motoxer4533
ソース