Deutsch

How To: Aktivieren der Ziehfunktion in einem infoWindow-Pop-up in Web AppBuilder for ArcGIS

Zusammenfassung

Wenn Benutzer auf ein Feature in einer Webkarte klicken, wird das infoWindow-Pop-up so eingestellt, dass es an derselben Position, an der sich der Zeiger befindet, geöffnet wird und nicht verschoben werden kann. Dieses Verhalten ist by Design. Dadurch können andere Features jedoch blockiert und die Ansicht gestört werden.

In den Anweisungen wird beschrieben, wie sich das Pop-up in Web AppBuilder for ArcGIS durch Ziehen des Fensters mit dem Mauszeiger verschieben lässt.
 

Vorgehensweise

Führen Sie die folgenden Schritte aus, um die Ziehfunktion in einem Pop-up zu aktivieren, indem Sie das dafür konzipierte Dojo-Toolkit verwenden. An den beiden Basisdateien in Web AppBuilder for ArcGIS müssen Änderungen vorgenommen werden:

  • die Datei common.css unter [app install]\server\apps\[app#]\themes\LaunchpadTheme
  • die Datei common.css unter [app install]\server\apps\[app#]\themes\LaunchpadTheme
  1. Bearbeiten Sie die Datei "common.css", um die Eigenschaft move in den Cursor einzufügen. Im folgenden Codeausschnitt wird veranschaulicht, wie der Zeiger in einen move cursor geändert wird, um ein verschiebbares Fenster anzugeben.
@import url("panels/LaunchpadPanel/style.css");    
.esriPopupWrapper .title {  
    cursor: move;  
}  
.esriPopup .hidden {  
    display: none !important;
  1. Definieren Sie in der Datei "utils.js" das festgelegte Dojo-Toolkit am Anfang des Codes. Die Eigenschaft define muss die folgende Dojo-Definition aufweisen.
define([
 ...
    'dojo/dnd/Moveable',
    'dojo/dom-class',
 ...
  ],
  1. Suchen Sie in derselben utils.js-Datei den Codeausschnitt mo.createWebMap, und bearbeiten Sie in so, dass die in Schritt 2 hinzugefügten Dojo-Eigenschaften einbezogen werden. Der folgende Codeausschnitt demonstriert, wie der Code beim Bearbeiten aussieht.
mo.createWebMap = function(portalUrl, itemId, mapDiv, /* optional */ options) 
{  
    portalUrl = portalUrlUtils.getStandardPortalUrl(portalUrl);  
    var itemUrl = portalUrlUtils.getBaseItemUrl(portalUrl);  
    arcgisUtils.arcgisUrl = itemUrl;  
    var def = arcgisUtils.createMap(itemId, mapDiv, options);  
    def.then(function (response){  
        var map = response.map;  
        var handle = query(".title", map.infoWindow.domNode)[0];  
        var dnd = new Moveable(map.infoWindow.domNode, {  
            handle: handle  
        });  
}); 
     return def;  
  };

Referenzinformationen