ANDS Community
http://community.ands.org.au/

Location Capture Widget - displaying data
http://community.ands.org.au/viewtopic.php?f=221&t=3311
Page 1 of 1

Author:  a.brown [ Wed Feb 12, 2014 10:00 am ]
Post subject:  Location Capture Widget - displaying data

Hi

I was wondering if there is a code snippet to display the data returned from the Location Capture Widget?

IE As it is displayed on a view such as here http://researchdata.ands.org.au/theatreworks-archive


Thanks

Aaron

Author:  mnguyen [ Fri Feb 14, 2014 11:16 am ]
Post subject:  Re: Location Capture Widget - displaying data

Hi

The location capture widget can and will return a lonlat string with a return callback, so you can do something like:
Code:
$('#map_widget').ands_location_widget({
 return_callback: function(data){
  alert(data);
 //data is the lonlat string when complete the drawing in the widget
 }
})


The location capture widget also provides a way to put the lonlat string in a new widget
Code:
$("#map_widget").ands_location_widget({
   lonLat:"151.503462,-33.251348 150.558638,-33.039778 149.767623,-34.137978 150.844283,-34.754050 151.283736,-33.937689 151.503462,-33.251348"
});


To achieve something like http://researchdata.ands.org.au/theatreworks-archive, you will need the lonlat string and knowledge on how to use the google map API, so basically we draw the lonlat string using polygons. You can view the open sourced code here in the drawMap() function https://github.com/au-research/ANDS-Registry-Core/blob/master/applications/portal/view/assets/js/view.js

Try that and let me know if you need any help
Regards,
Minh

Author:  a.brown [ Wed Feb 19, 2014 4:50 pm ]
Post subject:  Re: Location Capture Widget - displaying data

Thanks, got it working.

Basically I used CSS
---------------------
#spatial_coverage_map {
width: 440px;
height: 320px;
margin-bottom: 10px;
margin-top: 10px;
}

#spatial_coverage_map div {
margin-bottom: 0px;
}
--------------------
<html>
<head>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=drawing&amp;sensor=false"></script>
<script type="text/javascript" src="/js/jquery/jquery-1.10.2.min.js"></script>
<link rel="stylesheet" href="/js/blah.css" type="text/css" media="screen">
<script type="text/javascript">
$(document).ready(function() {
drawMap();
function drawMap(){ //drawing the map on the left side
...
}

function stringToLatLng(str){
...
}
});
</script>

</head>
<body>
<div id="spatial_coverage_map"></div>
<p class="coverage hide">136.406250,-19.864894 131.835938,-25.378772 146.953125,-29.434814 136.406250,-19.864894</p> /*sample coordinates */
</body>
</html>

Page 1 of 1 All times are UTC + 10 hours [ DST ]
Powered by phpBB® Forum Software © phpBB Group
http://www.phpbb.com/