openlayers - Open Layers + jquery -
i doing master thesis on internet mapping. task display research work @ department on webpage on top of google maps. far successful in that, problem not able find way connect layers on map individual row on table in same page. trying use jquery how link row in table layer on map. can body me how that. can see work below:
[http://130.237.175.39/goran_1.html][1]
in page have created 2 div elements map object , table. posting 2 elements of code here. if want see full code can see in page source.
<!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 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: </a>', separator: ' , ', numdigits: 0, emptystring: 'mouse not on 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>
Comments
Post a Comment