This commit is contained in:
bastianonm
parent
3054a34306
commit
53639d7a97
|
|
@ -0,0 +1,89 @@
|
|||
function wpgpxmaps(targhetId,mapType,mapData,graphData)
|
||||
{
|
||||
var el = document.getElementById(targhetId);
|
||||
var el_map = el.childNodes[0];
|
||||
var el_chart = el.childNodes[1];
|
||||
switch (mapType)
|
||||
{
|
||||
case 'TERRAIN': { mapType = google.maps.MapTypeId.TERRAIN; break;}
|
||||
case 'SATELLITE': { mapType = google.maps.MapTypeId.SATELLITE; break;}
|
||||
case 'ROADMAP': { mapType = google.maps.MapTypeId.ROADMAP; break;}
|
||||
default: { mapType = google.maps.MapTypeId.HYBRID; break;}
|
||||
}
|
||||
var mapOptions = {
|
||||
mapTypeId: mapType
|
||||
};
|
||||
var map = new google.maps.Map(el_map, mapOptions);
|
||||
if (graphData!= '')
|
||||
{
|
||||
var data = new google.visualization.DataTable();
|
||||
data.addColumn('number', 'Lunghezza');
|
||||
data.addColumn('number', 'Altezza');
|
||||
data.addRows(graphData);
|
||||
var chart = new google.visualization.AreaChart(el_chart);
|
||||
var options = { curveType: "function",
|
||||
strictFirstColumnType: true,
|
||||
hAxis : {format : '#,###m', title : "Lunghezza"},
|
||||
vAxis : {format : '#,###m', title : "Altitudine"},
|
||||
legend : {position : 'none'},
|
||||
chartArea: {left:70,top:10,width:"100%",height:"75%"}
|
||||
};
|
||||
chart.draw(data, options);
|
||||
google.visualization.events.addListener(chart, 'onmouseover', function (e) {
|
||||
var r = e['row'];
|
||||
if (marker)
|
||||
{
|
||||
var point = getItemFromArray(mapData,r)
|
||||
marker.setPosition(new google.maps.LatLng(point[0],point[1]));
|
||||
}
|
||||
});
|
||||
google.visualization.events.addListener(chart, 'onmouseout', function (e) {
|
||||
if (marker)
|
||||
{
|
||||
if (chart.getSelection() != '')
|
||||
{
|
||||
var r = chart.getSelection()[0]['row'];
|
||||
var point = getItemFromArray(mapData,r)
|
||||
marker.setPosition(new google.maps.LatLng(point[0], point[1]));
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
if (mapData != '')
|
||||
{
|
||||
var points = [];
|
||||
var bounds = new google.maps.LatLngBounds();
|
||||
for(var i in mapData)
|
||||
{
|
||||
var p = new google.maps.LatLng(mapData[i][0], mapData[i][1]);
|
||||
points.push(p);
|
||||
bounds.extend(p);
|
||||
}
|
||||
var poly = new google.maps.Polyline({
|
||||
path: points,
|
||||
strokeColor: "#3366cc",
|
||||
strokeOpacity: .7,
|
||||
strokeWeight: 4
|
||||
});
|
||||
poly.setMap(map);
|
||||
map.setCenter(bounds.getCenter());
|
||||
map.fitBounds(bounds);
|
||||
var first = getItemFromArray(mapData,0)
|
||||
var marker = new google.maps.Marker({
|
||||
position: new google.maps.LatLng(first[0], first[1]),
|
||||
title:"Hello World!"
|
||||
});
|
||||
marker.setMap(map);
|
||||
}
|
||||
}
|
||||
function getItemFromArray(arr,index)
|
||||
{
|
||||
try
|
||||
{
|
||||
return arr[index];
|
||||
}
|
||||
catch(e)
|
||||
{
|
||||
return [0,0];
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
=== WP-GPX-Maps ===
|
||||
Contributors: bastianonm
|
||||
Donate link: http://www.darwinner.it/
|
||||
Tags: maps, gpx, graph, google maps, google chart
|
||||
Requires at least: 2.0.0
|
||||
Tested up to: 3.3
|
||||
Stable tag: 1.0.0
|
||||
License: GPLv2 or later
|
||||
|
||||
Add a gpx trak with altitude graph
|
||||
|
||||
== Description ==
|
||||
|
||||
Add a gpx trak with altitude graph
|
||||
|
||||
WP-GPX-Maps
|
||||
|
||||
== Installation ==
|
||||
|
||||
This section describes how to install the plugin and get it working.
|
||||
|
||||
e.g.
|
||||
|
||||
1. Use the classic wordpress plugin installer or copy the plugins folder to the `/wp-content/plugins/` directory
|
||||
1. Activate the plugin through the 'Plugins' menu in WordPress
|
||||
1. Add the shortcode [sgpx gpx="<relative path to your gpx>"]
|
||||
|
||||
== Frequently Asked Questions ==
|
||||
|
||||
= Is it free? =
|
||||
|
||||
Yes!
|
||||
|
||||
= What happening if I've a very large gpx? =
|
||||
|
||||
This plugin will print a small amout of points in orther to speedup javascript and pageload.
|
||||
|
||||
== Screenshots ==
|
||||
|
||||
|
||||
== Changelog ==
|
||||
|
||||
= 0.5 =
|
||||
* Initial release.
|
||||
|
|
@ -0,0 +1,150 @@
|
|||
<?php
|
||||
/*
|
||||
Plugin Name: WP-GPX-Maps
|
||||
Plugin URI: http://www.darwinner.it/
|
||||
Description: Add a gpx trak with altitude graph
|
||||
Version: 1.0.0
|
||||
Author: Bastianon Massimo
|
||||
Author URI: http://www.pedemontanadelgrappa.it/
|
||||
License: GPL
|
||||
*/
|
||||
|
||||
include 'wp-gpx-maps_Utils.php';
|
||||
|
||||
add_action( 'wp_print_scripts', 'enqueue_WP_GPX_Maps_scripts' );
|
||||
|
||||
function enqueue_WP_GPX_Maps_scripts()
|
||||
{
|
||||
?>
|
||||
<script type='text/javascript' src='https://www.google.com/jsapi?ver=3.2.1'></script>
|
||||
<script type="text/javascript">
|
||||
google.load("maps", "3", {other_params: "sensor=false"});
|
||||
google.load('visualization', '1', {'packages':['corechart']});
|
||||
</script>
|
||||
<script type='text/javascript' src='<?php echo plugins_url('/wp-gpx-maps.js', __FILE__) ?>'></script>
|
||||
<?php
|
||||
}
|
||||
|
||||
//add_shortcode('wpgpxmaps','handle_WP_GPX_Maps_Shortcodes');
|
||||
|
||||
add_shortcode('sgpx','handle_WP_GPX_Maps_Shortcodes');
|
||||
|
||||
function handle_WP_GPX_Maps_Shortcodes($attr, $content='')
|
||||
{
|
||||
$gpx = $attr["gpx"];
|
||||
$key = get_option("wpgpxmaps_bing_license");
|
||||
$w = get_option("wpgpxmaps_width");
|
||||
$h = get_option("wpgpxmaps_height");
|
||||
$t = get_option("wpgpxmaps_map_type");
|
||||
|
||||
$r = rand(1,5000000);
|
||||
|
||||
$points = getPoints($gpx);
|
||||
$points_maps = '';
|
||||
$points_graph = '';
|
||||
|
||||
foreach ($points as $p) {
|
||||
$points_maps .= "[".(float)$p[0].",".(float)$p[1]."],";
|
||||
$points_graph .= "[".(float)$p[3].",".(float)$p[2]."],";
|
||||
}
|
||||
$p="/,$/";
|
||||
$points_maps = preg_replace($p, "", $points_maps);
|
||||
$points_graph = preg_replace($p, "", $points_graph);
|
||||
|
||||
echo
|
||||
'
|
||||
<div id="wpgpxmaps_'.$r.'" style="clear:both;">
|
||||
<div id="map_'.$r.'" style="width:'.$w.'; height:'.$h.'"></div>
|
||||
<div id="chart_'.$r.'" class="plot" style="width:'.$w.'; height:'.(preg_replace("([pxPX%emEM])", "", $h) / 2).'px"></div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
jQuery(document).ready(function () {
|
||||
var m_'.$r.' = ['.$points_maps.'];
|
||||
var c_'.$r.' = ['.$points_graph.'];
|
||||
wpgpxmaps("wpgpxmaps_'.$r.'",\''.$t.'\',m_'.$r.',c_'.$r.');
|
||||
});
|
||||
|
||||
</script>';
|
||||
}
|
||||
|
||||
register_activation_hook(__FILE__,'WP_GPX_Maps_install');
|
||||
register_deactivation_hook( __FILE__, 'WP_GPX_Maps_remove');
|
||||
|
||||
function WP_GPX_Maps_install() {
|
||||
add_option("wpgpxmaps_width", '100%', '', 'yes');
|
||||
add_option("wpgpxmaps_height", '450px', '', 'yes');
|
||||
add_option('wpgpxmaps_map_type','HYBRID','','yes');
|
||||
}
|
||||
|
||||
function WP_GPX_Maps_remove() {
|
||||
delete_option('wpgpxmaps_width');
|
||||
delete_option('wpgpxmaps_height');
|
||||
delete_option('wpgpxmaps_map_type');
|
||||
}
|
||||
?>
|
||||
|
||||
<?php
|
||||
if ( is_admin() ){
|
||||
|
||||
add_action('admin_menu', 'wpgpxmaps_admin_menu');
|
||||
|
||||
function wpgpxmaps_admin_menu() {
|
||||
add_options_page('WP GPX Maps', 'WP GPX Maps', 'administrator', 'WP-GPX-Maps', 'WP_GPX_Maps_html_page');
|
||||
}
|
||||
}
|
||||
?>
|
||||
|
||||
<?php
|
||||
function WP_GPX_Maps_html_page() {
|
||||
?>
|
||||
<div>
|
||||
<h2>WP GPX Settings</h2>
|
||||
|
||||
<form method="post" action="options.php">
|
||||
<?php wp_nonce_field('update-options'); ?>
|
||||
|
||||
<table width="100%">
|
||||
<tr valign="top">
|
||||
<th width="200" scope="row">Maps Width:</th>
|
||||
<td>
|
||||
<input name="wpgpxmaps_width" type="text" id="wpgpxmaps_width" value="<?php echo get_option('wpgpxmaps_width'); ?>" style="width:50px;" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr valign="top">
|
||||
<th width="200" scope="row">Maps Height:</th>
|
||||
<td>
|
||||
<input name="wpgpxmaps_height" type="text" id="wpgpxmaps_height" value="<?php echo get_option('wpgpxmaps_height'); ?>" style="width:50px;" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th width="200" scope="row">Default Map Type:</th>
|
||||
<td>
|
||||
|
||||
<?php
|
||||
$t = get_option('wpgpxmaps_map_type');
|
||||
if (!($t))
|
||||
$t = 'HYBRID';
|
||||
?>
|
||||
|
||||
<input type="radio" name="wpgpxmaps_map_type" value="HYBRID" <?php if ($t == 'HYBRID') echo 'checked'; ?> > This map type displays a transparent layer of major streets on satellite images.<br />
|
||||
<input type="radio" name="wpgpxmaps_map_type" value="ROADMAP" <?php if ($t == 'ROADMAP') echo 'checked'; ?>> This map type displays a normal street map.<br />
|
||||
<input type="radio" name="wpgpxmaps_map_type" value="SATELLITE" <?php if ($t == 'SATELLITE') echo 'checked'; ?>> This map type displays satellite images.<br />
|
||||
<input type="radio" name="wpgpxmaps_map_type" value="TERRAIN" <?php if ($t == 'TERRAIN') echo 'checked'; ?>> This map type displays maps with physical features such as terrain and vegetation.<br />
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
|
||||
<input type="hidden" name="action" value="update" />
|
||||
|
||||
<p>
|
||||
<input type="submit" value="<?php _e('Save Changes') ?>" />
|
||||
</p>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
<?php
|
||||
|
||||
|
||||
function getPoints($gpxPath,$gpxOffset = 10)
|
||||
{
|
||||
$points = array();
|
||||
|
||||
$dist=0;
|
||||
|
||||
$lastLat=0;
|
||||
$lastLon=0;
|
||||
$lastEle=0;
|
||||
$lastOffset=0;
|
||||
|
||||
//Default Offset = 10 mt
|
||||
if (!($gpxOffset > 0))
|
||||
{
|
||||
$gpxOffset = 10;
|
||||
}
|
||||
|
||||
$realGpxPath = substr (__FILE__, 0, strrpos(__FILE__,'/wp-content/')).$gpxPath;
|
||||
|
||||
if (file_exists($realGpxPath))
|
||||
{
|
||||
|
||||
$gpx = simplexml_load_file($realGpxPath);
|
||||
$gpx->registerXPathNamespace('10', 'http://www.topografix.com/GPX/1/0');
|
||||
$gpx->registerXPathNamespace('11', 'http://www.topografix.com/GPX/1/1');
|
||||
|
||||
foreach($gpx->xpath('//trkpt | //10:trkpt | //11:trkpt') as $trkpt){
|
||||
$lat = $trkpt['lat'];
|
||||
$lon = $trkpt['lon'];
|
||||
$ele = $trkpt->ele;
|
||||
if ($lastLat == 0 && $lastLon == 0)
|
||||
{
|
||||
//Base Case
|
||||
array_push($points, array((float)$lat,(float)$lon,(float)round($ele,1),(float)round($dist,1)));
|
||||
$lastLat=$lat;
|
||||
$lastLon=$lon;
|
||||
$lastEle=$ele;
|
||||
}
|
||||
else
|
||||
{
|
||||
//Normal Case
|
||||
$offset = calculateDistance($lat, $lon, $ele,$lastLat, $lastLon, $lastEle);
|
||||
$dist = $dist + $offset;
|
||||
if (((float) $offset + (float) $lastOffset) > $gpxOffset)
|
||||
{
|
||||
//Bigger Offset -> write coordinate
|
||||
$lastOffset=0;
|
||||
array_push($points, array((float)$lat,(float)$lon,(float)round($ele,1),(float)round($dist,1)));
|
||||
}
|
||||
else
|
||||
{
|
||||
//Smoller Offset -> continue..
|
||||
$lastOffset= (float) $lastOffset + (float) $offset ;
|
||||
}
|
||||
}
|
||||
$lastLat=$lat;
|
||||
$lastLon=$lon;
|
||||
$lastEle=$ele;
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
array_push($points, array((float)0,(float)0,(float)0,(float)0));
|
||||
}
|
||||
|
||||
// riduco l'array a circa 200 punti per non appensantire la pagina(mappa e grafico)!
|
||||
$count=sizeof($points);
|
||||
if ($count>200)
|
||||
{
|
||||
$f = round($count/200);
|
||||
if ($f>1)
|
||||
for($i=$count;$i>0;$i--)
|
||||
if ($i % $f != 0)
|
||||
unset($points[$i]);
|
||||
}
|
||||
return $points;
|
||||
}
|
||||
|
||||
function toRadians($degrees)
|
||||
{
|
||||
return $degrees * 3.1415926535897932385 / 180;
|
||||
}
|
||||
|
||||
function calculateDistance($lat1,$lon1,$ele1,$lat2,$lon2,$ele2)
|
||||
{
|
||||
//Distance in meters
|
||||
$dLat = toRadians((float) $lat2 - (float) $lat1);
|
||||
$dLng = toRadians((float) $lon2 - (float) $lon1);
|
||||
$a = (float) ( sin($dLat / 2) * sin($dLat / 2)) + (float) ( cos( toRadians($lat1)) * cos( toRadians($lat2)) * sin($dLng / 2) * sin($dLng / 2) );
|
||||
$dist = 2 * 3958.75 * atan2(sqrt($a), sqrt(1 - (float) $a));
|
||||
return sqrt(pow($dist * 1609.00, 2) + pow((float) $lat1 - (float)$lat2, 2));
|
||||
}
|
||||
|
||||
?>
|
||||
Loading…
Reference in New Issue