2014-02-28 56 views
0

我已經聲明瞭FloatingPane「testFloatingPane」,但是當我點擊地圖時,使用
pFP = registry.byId("testFloatingPane");來檢索它,pFP保持未定義狀態。 (請參閱此操作here)我在做什麼錯誤的代碼?獲取對FloatingPane的引用

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" /> 
    <title>Simple Map</title> 
    <link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css"> 
    <link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.8/js/dgrid/css/skins/claro.css"> 
    <link rel="stylesheet" type="text/css" href="https://js.arcgis.com/3.8/js/dojo/dojox/layout/resources/FloatingPane.css"> 
    <link rel="stylesheet" type="text/css" href="https://js.arcgis.com/3.8/js/dojo/dojox/layout/resources/ResizeHandle.css"> 
    <style> 
    html, body, #map { 
     height: 100%; 
     width: 100%; 
     margin: 0; 
     padding: 0; 
    } 

    body { 
     background-color: #FFF; 
     overflow: hidden; 
     font-family: "Trebuchet MS"; 
    } 

    #testFLoatingPane { 
     -moz-border-radius: 6px; 
     -webkit-border-radius: 6px; 
     position: absolute; 
     top: 35px; 
     left: 60px; 
     width: 500px; 
     height: 300px; 
     z-index: 90; 
    } 

    .dojoxFloatingPaneContent { 
     font-family: Arial, Helvetica, sans-serif; 
     font-size: 8pt; 
     font-weight: bold; 
     overflow: auto; 
    } 

    .dojoxFloatingPaneTitle, .reportTitlePane { 
     color: white; 
     background-color: #76a2c5; 
     font-family: Arial, Helvetica, sans-serif; 
     font-size: 12pt; 
     font-weight: bold; 
     overflow: auto; 
    } 
    </style> 
    <script src="http://js.arcgis.com/3.8/"></script> 
    <script> 
    var map; 
    var pFP; 

    require(["esri/map", "dojox/layout/FloatingPane", "dijit/registry", "dojo/ready", 
     "dojo/domReady!"], 
     function (Map, FloatingPane, registry, ready) { 
     ready(function() { 
      pFP = registry.byId("testFloatingPane"); 
     }) 

     //pFP = new FloatingPane({ 
     // title: "A floating pane", 
     // resizable: true, dockable: true, closable: false, 
     // //style: "position:relative;top:100px;left:0;width:400px;height:100px;visibility:hidden;", 
     // id: "pFloatingPane" 
     //}, dojo.byId("testFLoatingPane")); 
     //pFP.startup(); 

     map = new Map("map", { 
      basemap: "topo", 
      center: [-122.45, 37.75], // long, lat 
      zoom: 13, 
      sliderStyle: "small" 
     }); 

     map.on("click", function() { 
      pFP.show() 
     }); 
     }); 
    </script> 
</head> 

<body class="claro"> 
    <div id="map"></div> 
    <!--<div id="testFloatingPane"></div>--> 
    <div id="testFloatingPane" data-dojo-type="dojox/layout/FloatingPane" 
    data-dojo-props="title:'Search Results', closable:false, resizable:true, dockable:true" 
    style="visibility: hidden;"> 
    <!--<div id="reportContainer" data-dojo-type="dijit/layout/ContentPane"> 
    </div>--> 
    </div> 
</body> 
</html> 

回答

0

這是離開了行

<script>dojoConfig = { parseOnLoad: true }</script> 

它工作正常here的情況下(在固定的CSS一個錯誤,太)

我也可以省略和使用parser.parse();在我準備好的功能。