Commit 7f5c53688be0e5c78de8c4926ef247a6e2feed60

  • avatar
  • arvind
  • Mon Jun 11 18:40:04 IST 2012
Closing annotation div, JSON to store the annotations
  • Diff rendering mode:
  • inline
  • side by side

myVector.js

10var box_extents1 = [10var box_extents1 = [
11 [4263.0000, -1630.33337, 4559.0000, -1342.33337]11 [4263.0000, -1630.33337, 4559.0000, -1342.33337]
12];12];
13var myJSON = {};
13// avoid pink tiles14// avoid pink tiles
14OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;15OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
15OpenLayers.Util.onImageLoadErrorColor = "transparent";16OpenLayers.Util.onImageLoadErrorColor = "transparent";
……
65}65}
66function onMyFeatureSelect(feature, json, x, y)66function onMyFeatureSelect(feature, json, x, y)
67{67{
68// str = "";
69// x = 1;
70 z = new OpenLayers.Popup.FramedCloud(68 z = new OpenLayers.Popup.FramedCloud(
71 "test",69 "test",
72 new OpenLayers.LonLat(x, y), // Always should be at the center of the map, not the center of viewport.70 new OpenLayers.LonLat(x, y), // Always should be at the center of the map, not the center of viewport.
……
225 console.log(labelFeature.attributes['name']);225 console.log(labelFeature.attributes['name']);
226 if(labelFeature.attributes['name'])226 if(labelFeature.attributes['name'])
227 {227 {
228 //console.log(myObj.feature.geometry.bounds.top); Use this to get the bounds.
229 top = myObj.feature.geometry.bounds.top;
228 console.log(myObj.feature.geometry.bounds.top); //Use this to get the bounds.
229 topValue = myObj.feature.geometry.bounds.top;
230 bottom = myObj.feature.geometry.bounds.bottom;230 bottom = myObj.feature.geometry.bounds.bottom;
231 left = myObj.feature.geometry.bounds.left;231 left = myObj.feature.geometry.bounds.left;
232 right = myObj.feature.geometry.bounds.right;232 right = myObj.feature.geometry.bounds.right;
……
235 vectorLayer.drawFeature(labelFeature);235 vectorLayer.drawFeature(labelFeature);
236 vectorLayer.addFeatures([labelFeature]);236 vectorLayer.addFeatures([labelFeature]);
237 annotationTree();237 annotationTree();
238 attribs = {
239 "top": topValue,
240 "bottom": bottom,
241 "right": right,
242 "left": left,
243 "name": name,
244 "character": $("#character-value").text(),
245 "material": $("#material-value").text()
246 };
238 }247 }
239 else248 else
240 myObj.feature.destroy();249 myObj.feature.destroy();

openlayers.html

35 </style>35 </style>
36 <script src="http://www.openlayers.org/api/2.11/OpenLayers.js" type="text/javascript"></script>36 <script src="http://www.openlayers.org/api/2.11/OpenLayers.js" type="text/javascript"></script>
37 <script type="text/javascript" src="myVector.js"></script>37 <script type="text/javascript" src="myVector.js"></script>
38 <script type="text/javascript">
39 function treeClose()
40 {
41 $('#annotation-tree').hide();
42 myJSON['attribs'] = attribs;
43 }
44 </script>
38 </head>45 </head>
39<body onload="init();inits();">
46<body onload="init();">
40 <div id="header"><h1>Lepakshi Mural</h1></div>47 <div id="header"><h1>Lepakshi Mural</h1></div>
41 <div id="subheader">Generated by <a href="http://www.maptiler.org/">MapTiler</a><a href="http://www.klokan.cz/projects/gdal2tiles/">GDAL2Tiles</a>, Copyright &copy; 2008 <a href="http://www.klokan.cz/">Klokan Petr Pridal</a>, <a href="http://www.gdal.org/">GDAL</a> &amp; <a href="http://www.osgeo.org/">OSGeo</a> <a href="http://code.google.com/soc/">GSoC</a>48 <div id="subheader">Generated by <a href="http://www.maptiler.org/">MapTiler</a><a href="http://www.klokan.cz/projects/gdal2tiles/">GDAL2Tiles</a>, Copyright &copy; 2008 <a href="http://www.klokan.cz/">Klokan Petr Pridal</a>, <a href="http://www.gdal.org/">GDAL</a> &amp; <a href="http://www.osgeo.org/">OSGeo</a> <a href="http://code.google.com/soc/">GSoC</a>
42 <!-- PLEASE, LET THIS NOTE ABOUT AUTHOR AND PROJECT SOMEWHERE ON YOUR WEBSITE, OR AT LEAST IN THE COMMENT IN HTML. THANK YOU -->49 <!-- PLEASE, LET THIS NOTE ABOUT AUTHOR AND PROJECT SOMEWHERE ON YOUR WEBSITE, OR AT LEAST IN THE COMMENT IN HTML. THANK YOU -->
43 </div>50 </div>
44 <input onclick="handler.trigger();" type="button" style="background-color:#00CC00;height:15px;-moz-border-radius:75px;-webkit-border-radius:75px; width:15px;" value="Mural" /><br /><div id="content"></div>
45 <input onclick="handler.trigger1();" type="button" style="background-color:#00CC00;height:15px;-moz-border-radius:75px;-webkit-border-radius:75px; width:15px;" value="Face" /><br /><div id="content1"></div>
46 <input onclick="handler.trigger2();" type="button" style="background-color:#00CC00;height:15px;-moz-border-radius:75px;-webkit-border-radius:75px; width:15px;" value="Jewelery" /><br /><div id="content2"></div>
51 <input onclick="handler.trigger();" type="button" style="background-color:#00CC00;height:15px;-moz-border-radius:75px;-webkit-border-radius:75px; width:15px;"/>Mural<div id="content"></div>
52 <input onclick="handler.trigger1();" type="button" style="background-color:#00CC00;height:15px;-moz-border-radius:75px;-webkit-border-radius:75px; width:15px;"/>Face<div id="content1"></div>
53 <input onclick="handler.trigger2();" type="button" style="background-color:#00CC00;height:15px;-moz-border-radius:75px;-webkit-border-radius:75px; width:15px;"/>Jewellery<div id="content2"></div>
47 <div id="map"></div>54 <div id="map"></div>
48 <div>55 <div>
49 <ul>56 <ul>
……
69 </ul>69 </ul>
70 </div>70 </div>
71 <script type="text/javascript" >resize()</script>71 <script type="text/javascript" >resize()</script>
72 <div id="annotation-tree"><div id="infovis">
72 <div id="annotation-tree">
73 <input type="button" value="close" onClick="treeClose();"/>
74 <div id="infovis">
73 <form>75 <form>
74 <div>Charater: <span id="character-value"></span></div>
76 <div>Character: <span id="character-value"></span></div>
75 <div>Ornament </div>77 <div>Ornament </div>
76 <div>Material: <span id="material-value"></span></div>78 <div>Material: <span id="material-value"></span></div>
77 <div>Jewellery: <span id="jewellery-value"></span></div>79 <div>Jewellery: <span id="jewellery-value"></span></div>