2011-12-31 5 views
0

gis.stackexchange.comの地理的性質のために私の質問をしましたが、ここではもっと大きな回答があると思いました。 https://gis.stackexchange.com/q/18327/3773OpenLayersのレイヤーの不透明度を制御するためにjQuery UIスライダーを使用する

私はOpenLayersでレイヤの不透明度を制御するためにjQuery UI Sliderを利用しようとしていましたが、「値」オプションを「最大」以外の値に設定しようとすると問題が発生します。

setOpacityメソッドは、レイヤの不透明度を20%のオンロードに変更します。ただし、スライダーは正しい位置に表示されますが、レイヤーに不透明度の「最大」値(100%/不透明)が表示されます。

ウェブページにsetOpacityを強制的にロードする必要がありますが、これを行う方法はよくわかりません。

不要なコードをすべて削除しました。あなたの助けが大いにありがとう!

<script type="text/javascript"> 
    var options = {maxExtent: new OpenLayers.Bounds(-10592586.767623,5113378.756775,-8275939.536344,7731361.313701)}; 

    function init(){ 
     OpenLayers.ImgPath = "http://js.mapbox.com/theme/dark/"; 

     map = new OpenLayers.Map("map",{ 
      maxExtent: new OpenLayers.Bounds(-10592586.767623,5113378.756775,-8275939.536344,7731361.313701), 
      maxResolution:"auto", 
      units:'m', 
      controls:[ 
       new OpenLayers.Control.Navigation(), 
       new OpenLayers.Control.PanZoomBar(), 
       new OpenLayers.Control.KeyboardDefaults(), 
       new OpenLayers.Control.MousePosition(), 
       new OpenLayers.Control.LayerSwitcher(), 
       new OpenLayers.Control.Navigation({dragPanOptions: {enableKinetic: true}}) 
       ] 
      }); 

     hii_1 = new OpenLayers.Layer.MapServer("HII","http://127.0.0.1/cgi-bin/mapserv.exe",{ 
      map:'C:/ms4w/Apache/htdocs/hii/hii_landcover.map'},{ 
      isBaseLayer:false, 
      transparent:true, 
      format:"image/png", 
      alpha:true 
      }); 

     osm_mapnik = new OpenLayers.Layer.OSM("OpenStreetMap: Mapnik"); 

     gmap = new OpenLayers.Layer.Google("Google Maps: Streets"); 

     map.addLayers([hii_1,osm_mapnik,gmap]); 
     map.zoomToMaxExtent(); 
     map.setCenter(new OpenLayers.LonLat(-9434263,6422370),5); 
</script> 

<script> 
$(function() { 
    $("#slider1").slider({ 
    range: "min", 
    min: 0, 
    value: 20, 
    slide: function(e, ui) { 
     hii_1.setOpacity(ui.value/100); 
     $("#amount1").val(ui.value); 
    } 
    }); 
    $("#amount1").val($("#slider1").slider("value")); 
</script> 
+0

はここに答え http://gis.stackexchange.com/questions/18327/using-the-jquery-ui-slider-to-control-layer-opacity-in-openlayers –

答えて

0

スライダのコールバックはonLoadと呼ばれません。イベントを手動でトリガーするには、例についてはTrigger a jQuery UI slider eventを参照してください。

レイヤーは不透明度が0.20の方がよいでしょう。プロパティの不透明度をレイヤーオプションに追加することで、これを達成できます。

{ isBaseLayer:false, transparent:true, format:"image/png", alpha:true, opacity:0.20 }

関連する問題