Kenneth at 19:44, 2 November 2015

2015-11-02T19:44:20Z

New page

http://www.roadtripryan.com/go/map/iframe-gpx?id=140

<iframe src="http://www.roadtripryan.com/go/map/iframe-gpx?id=140" style="width: 100%; height: 510px; border: 0px; padding: 0px; margin: 0px"></iframe>

GPX: http://www.roadtripryan.com/go/gpx/full/140

<pre>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script type="text/javascript" src="/go/layouts/fall-2014/js/c191114.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type="text/javascript" src="/go/js/google-map.js"></script>
<script type="text/javascript" src="/go/js/ajroadtrips/topomaplayer.js"></script>
</head>
<body>
<script type="text/javascript">
var markers = new Array();
var markersCount = 0;
var map;

function mapLoad() {
var mapOptions = {
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControlOptions: {
mapTypeIds: [
google.maps.MapTypeId.ROADMAP,
"tnmbasemap",
google.maps.MapTypeId.HYBRID,
google.maps.MapTypeId.TERRAIN,
google.maps.MapTypeId.SATELLITE
]
}
};

map = new google.maps.Map(document.getElementById("gmap"), mapOptions);
var bounds = new google.maps.LatLngBounds ();
map.mapTypes.set('tnmbasemap', tnmBaseMapType);
map.setMapTypeId(google.maps.MapTypeId.TERRAIN);

jQuery.get("/go/gpx/full/140", {}, function (data) {
jQuery(data).find("trk").each(function () {
var points = [];
$(this).find("trkpt").each(function() {
var lat = $(this).attr("lat");
var lon = $(this).attr("lon");
var p = new google.maps.LatLng(lat, lon);
points.push(p);
bounds.extend(p);
});

new google.maps.Polyline({
// use your own style here
path: points,
strokeColor: "#ff0000",
strokeOpacity: .7,
strokeWeight: 4,
map: map
});
});

jQuery(data).find("wpt").each(function() {
var infowindow = new google.maps.InfoWindow({
content: $(this).find("name").text()
});

var lat = $(this).attr("lat");
var lon = $(this).attr("lon");
var myLatlng = new google.maps.LatLng(lat, lon);
bounds.extend(myLatlng);
var marker = new google.maps.Marker({
position: myLatlng,
map: map
});
markers[markersCount] = marker;
markersCount++;
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
});
// fit bounds to track
map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
})
}

$(document).ready(function(){
mapLoad();
$('#tab-container').bind('easytabs:after', function() {
google.maps.event.trigger(map, 'resize');
map.setCenter(markers[0].getPosition());
map.setZoom(12);
}) ;
}
);
//]]>
</script>
<div id="gmap" style="width:100%;height:500px;padding: 0px; margin: 0px"></div>
</body>
</html>
</pre>

Fifth Water Hot Springs/Google Map - Revision history

Kenneth at 19:44, 2 November 2015