1

私はインターネット マッピングに関する修士論文を書いています。私の仕事は、自分の部門での研究成果を Google マップ上の Web ページに表示することです。これまでのところ成功しましたが、マップ上のレイヤーを同じページのテーブルの個々の行に接続する方法を見つけることができないという問題があります。jqueryを使用して、テーブルの行をマップ上のレイヤーにリンクする方法を試しています。どんな体でもそれを行う方法を教えてくれますか? あなたは以下の私の作品を見ることができます：

[http://130.237.175.39/goran_1.html][1]

私のページでは、マップ オブジェクトとテーブルの 2 つの div 要素を作成しました。コードのこれら 2 つの要素をここに投稿しています。完全なコードを見たい場合は、ページのソースで見ることができます。

<!DOCTYPE html>
<html>
<head>
  <title>Land Uplift</title>
    <script src="http://193.10.6.144/api/OpenLayers.js"></script>
    <link rel="stylesheet" type="text/css" href="http://130.237.186.211/geoserver/scalebar.css">
    <link rel="stylesheet" type="text/css" href="http://130.237.186.211/geoserver/mousepos.css">
    </head>
<body>
<div id="header">
<h1 style="margin-bottom:0;text-align:center;">Land Uplift Project</h1></div>
<div id="table" style="height:100px;width:200px;margin-left:50px;">
<table border="1">
<tr>
<th>Layer</th>
<th>Layer Description</th>
</tr>
<tr>
<td>5000_fKr</td>
<td>4500_fKr</td>
</tr>
<tr>
<td>4000_fKr</td>
<td>3500_fKr</td>
</tr>
</table></div>
<div id="content" style="background-color:#EEEEEE;height:400px;width:600px;float:right;">
Description of the project</div>
<div id="map" style="height:800px;width:1000px;float:left;">
<script defer="defer" type="text/javascript">
          var map = new OpenLayers.Map('map', {allOverlays: true, controls: []});
            var wms_layer_Test_5000_fKr = new OpenLayers.Layer.WMS(
            'Test_5000_fKr',
            'http://130.237.175.39:8080/geoserver/wms/test_test',
            {layers: 'Test_5000_fKr', transparent: "true", format: "image/png"},

            {maxExtent: new OpenLayers.Bounds(585000, 6600000, 740000, 6722500), maxResolution: 'auto', projection:"EPSG:3006", units: "m"},
            {isBaseLayer: false}, 
            {visibility: true},
            {transparent: true}
            );

      map.addLayers([wms_layer_Test_5000_fKr]);

      var scalebar = new OpenLayers.Control.ScaleLine();
            map.addControl(scalebar);

            map.addControl(
                new OpenLayers.Control.MousePosition({
                    prefix: '<a target="_blank" ' +
                        'href="http://spatialreference.org/ref/epsg/3006/">' +
                        'SWEREF99 TM:&nbsp</a>',
                    separator: ' , ',
                    numDigits: 0,
                    emptyString: 'Mouse is not over map.'
                })
            );            

      var panel = new OpenLayers.Control.NavToolbar();
            map.addControl(panel);

      var panzoom = new OpenLayers.Control.PanZoomBar();
            map.addControl(panzoom);                                              

      var layer = new OpenLayers.Control.LayerSwitcher({'ascending':false});
            map.addControl(layer);

        map.zoomToMaxExtent();
      </script></div>

<div id="footer" style="clear:both;text-align:left;">
Copyright © ink.su.se</div>

</body>
</html>
4

0 に答える 0