2012-03-03 13 views
1

私の名前はTonyです。私はベトナムから来ました。私はwebgisにopenlayers/geoserverというマーカーを追加したいと思います。ここに私のコードは次のとおりです。openlayers/geoserverでマーカーを追加する

<!-- Import OL CSS, auto import does not work with our minified OL.js build --> 
    <link rel="stylesheet" type="text/css" href="http://localhost:8080/geoserver/openlayers/theme/default/style.css"/> 
    <!-- Basic CSS definitions --> 
    <style type="text/css"> 
    /* General settings */ 
    body { 
     font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
     font-size: small; 
    } 

    /* The map and the location bar */ 
    #map { 
     clear: both; 
     position: relative; 
     width: 1350px; 
     height: 600px; 
     border: 0px solid black; 
    } 

    </style> 

    <!-- Import OpenLayers, reduced, wms read only version --> 
    <script src="http://localhost:8080/geoserver/openlayers/OpenLayers.js" type="text/javascript"> 
    </script> 
    <script defer="defer" type="text/javascript"> 
    var map; 

    var tiled; 

    // pink tile avoidance 
    OpenLayers.IMAGE_RELOAD_ATTEMPTS = 5; 
    // make OL compute scale according to WMS spec 
    OpenLayers.DOTS_PER_INCH = 25.4/0.28; 

    function init(){ 
     // if this is just a coverage or a group of them, disable a few items, 
     // and default to jpeg format 
     format = 'image/png'; 

     var bounds = new OpenLayers.Bounds(
      143.83482400000003, -43.648056, 
      148.47914100000003, -39.573891 
     ); 
     var options = { 
      controls: [], 
      maxExtent: bounds, 
      maxResolution: 0.01814186328125, 
      projection: "EPSG:4326", 
      units: 'degrees' 
      }; 
     map = new OpenLayers.Map('map', options); 

     // setup tiled layer 
     tiled = new OpenLayers.Layer.WMS(
      "Geoserver layers - Tiled", "http://localhost:8080/geoserver/wms", 
      { 
       LAYERS: 'tasmania', 
       STYLES: '', 
       format: format, 
       tiled: true, 
       tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom 
      }, 
      { 
       buffer: 0, 
       displayOutsideMaxExtent: true, 
       isBaseLayer: true, 
       yx : {'EPSG:4326' : true} 
      } 
     ); 

     map.addLayers([tiled]); 

     // build up all controls 
     map.addControl(new OpenLayers.Control.PanZoomBar({ 
      position: new OpenLayers.Pixel(2, 15) 
     })); 
     map.addControl(new OpenLayers.Control.Navigation()); 
     map.addControl(new OpenLayers.Control.Scale($('scale'))); 
     map.addControl(new OpenLayers.Control.MousePosition({element: $('location')})); 
     map.zoomToExtent(bounds); 

     //marker 
     var markers = new OpenLayers.Layer.Markers("Markers"); 
     map.addLayer(markers); 

     var size = new OpenLayers.Size(21,25); 
     var offset = new OpenLayers.Pixel(-(size.w/2), -size.h); 
     var icon = new OpenLayers.Icon('http://localhost:8080/geoserver/openlayers/img/marker.png', size, offset); 
     markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(146.83482400000003, -42.648056),icon)); 
     markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(146.47914100000003, -41.573891),icon.clone())); 

     // support GetFeatureInfo 
     map.events.register('click', map, function (e) { 
      document.getElementById('nodelist').innerHTML = "Loading... please wait..."; 
      var params = { 
       REQUEST: "GetFeatureInfo", 
       EXCEPTIONS: "application/vnd.ogc.se_xml", 
       BBOX: map.getExtent().toBBOX(), 
       SERVICE: "WMS", 
       INFO_FORMAT: 'text/html', 
       QUERY_LAYERS: map.layers[0].params.LAYERS, 
       FEATURE_COUNT: 50, 
       Layers: 'tasmania', 
       WIDTH: map.size.w, 
       HEIGHT: map.size.h, 
       format: format, 
       styles: map.layers[0].params.STYLES, 
       srs: map.layers[0].params.SRS}; 

      OpenLayers.loadURL("http://localhost:8080/geoserver/wms", params, this, setHTML, setHTML); 
      OpenLayers.Event.stop(e); 
     }); 
    } 


    </script> 
</head> 
<body onload="init()"> 
<h1 id="title">Markers Layer Example</h1> 
<div id="map"> 
</div> 

</body> 

私が午前問題は、それはマーカーが表示されないということですちょうどwebmapと私はなぜ知られていません。ここに私のwebmapは、次のようになります。

----ます。http://i.stack.imgur.com/OWZtP.jpg---

私のイメージのパスは、私が続く真http://i1133.photobucket.com/albums/m591/tvquang_dn/marker.jpg

ですこのページ

http://dev.openlayers.org/releases/OpenLayers-2.7/doc/apidocs/files/OpenLayers/Marker-js.html私のコードを書いてください。 読んでいただきありがとうございます。

答えて

0

私はあなたの問題の解決策を見つけました。 デフォルトでは、geoserverに存在するopenlayer.jsファイルは171kbです。このファイルは、マーカーのポップアップなどのopenlayers操作の多くでは役に立ちません。したがって、完全なOpenlLayer.jsファイルを取得する必要があります。 openlayerのウェブサイトから300kb。

あなたのコードは何も変更する必要はありません。 ただ、それは確かに動作します。.. よろしく、 のGaurav

+0

ありがとうございましたが、私はOpenLayersをバージョン2.11(ZIP)をダウンロードし

は現在

あるスクリプトのソース を変更openlayerのウェブサイトとOpenlLayer.jsから約958kbです。 – Tony

関連する問題