mapa2 - moved from soundwalk
This commit is contained in:
parent
81b2406aa2
commit
f818689684
290
mapa2.php
Executable file
290
mapa2.php
Executable file
@ -0,0 +1,290 @@
|
|||||||
|
<?php
|
||||||
|
// Creación de mapas de los paseos
|
||||||
|
require_once( dirname(dirname(dirname(dirname( __FILE__ )))) . '/wp-load.php' );
|
||||||
|
//require_once (dirname( __FILE__ ) . '/libs/classes.php');
|
||||||
|
|
||||||
|
$walks = array();
|
||||||
|
|
||||||
|
// markers
|
||||||
|
// Get all markers
|
||||||
|
//
|
||||||
|
//
|
||||||
|
|
||||||
|
$args = array (
|
||||||
|
'post_type' => 'marker',
|
||||||
|
);
|
||||||
|
$posts = get_posts($args);
|
||||||
|
|
||||||
|
// fit to location
|
||||||
|
$fit = false;
|
||||||
|
if (isset($_GET['fit'])) {
|
||||||
|
$fit = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
?>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset=utf-8 />
|
||||||
|
<title>Mapa de Comunitats</title>
|
||||||
|
<script src='https://api.mapbox.com/mapbox.js/v2.2.4/mapbox.js'></script>
|
||||||
|
<script src='https://code.jquery.com/jquery-3.2.1.min.js'></script>
|
||||||
|
|
||||||
|
<!-- Latest compiled and minified CSS -->
|
||||||
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
|
||||||
|
|
||||||
|
<!-- Optional theme -->
|
||||||
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
|
||||||
|
|
||||||
|
<!-- Latest compiled and minified JavaScript -->
|
||||||
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
|
||||||
|
<link href='https://api.mapbox.com/mapbox.js/v2.2.4/mapbox.css' rel='stylesheet' />
|
||||||
|
<!--script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.12.3/mapbox-gl.js'></script>
|
||||||
|
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.12.3/mapbox-gl.css' rel='stylesheet' /-->
|
||||||
|
<style>
|
||||||
|
body { margin:0; padding:0; }
|
||||||
|
#map { position:absolute; top:0; bottom:0; width:100%;min-height:300px;display:block; }
|
||||||
|
.leaflet-div-icon { border:0; width:40px; height:40px;background:transparent; }
|
||||||
|
|
||||||
|
.claseSS {
|
||||||
|
border-radius:100%;
|
||||||
|
width:20px !important;
|
||||||
|
height:20px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.iniciativa { background:#a0d3cc; }
|
||||||
|
.interes { background:#ffd300; }
|
||||||
|
.agente { background:#00ff33; }
|
||||||
|
.comunidad_de_memoria { background:#aa0033; }
|
||||||
|
|
||||||
|
.info-layer {
|
||||||
|
display:none;
|
||||||
|
background:rgba(255,255,255,0.9);
|
||||||
|
position:fixed;
|
||||||
|
right:0;
|
||||||
|
width:25%;
|
||||||
|
height:100%;
|
||||||
|
z-index:3000;
|
||||||
|
padding:20px;
|
||||||
|
border-left:solid 3px #ccc;
|
||||||
|
overflow-y:scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-layer .marker-item { display:none;}
|
||||||
|
|
||||||
|
#marker-content,
|
||||||
|
#marker-sinopsis,
|
||||||
|
#marker-contacte,
|
||||||
|
#marker-ubicacio-barri,
|
||||||
|
#marker-ubicacio-districte,
|
||||||
|
#marker-forma-organitzativa,
|
||||||
|
#marker-sinopsis,
|
||||||
|
#marker-objecte-dinteres-general,
|
||||||
|
#marker-objecte-dinteres-especific,
|
||||||
|
#marker-objecte-dinteres,
|
||||||
|
#marker-agents-impulsors-de-la-iniciativa,
|
||||||
|
#marker-any-dinici,
|
||||||
|
#marker-content,
|
||||||
|
#marker-title
|
||||||
|
|
||||||
|
{ display:block;}
|
||||||
|
|
||||||
|
.col-50 {
|
||||||
|
width:46%;
|
||||||
|
padding:2%;
|
||||||
|
padding:0px;
|
||||||
|
float:left;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
<script type="text/javascript">
|
||||||
|
<?php
|
||||||
|
$marker_color="#000000";
|
||||||
|
print "walk = {
|
||||||
|
\"type\": \"FeatureCollection\",
|
||||||
|
\"features\": [";
|
||||||
|
$w=0;
|
||||||
|
foreach ($posts as $post) :
|
||||||
|
$cat = get_the_category($post->ID);
|
||||||
|
$slug = $cat[0]->slug;
|
||||||
|
$finfo = "http://irratia.zintzilik.net";
|
||||||
|
print "{
|
||||||
|
\"type\": \"Feature\",
|
||||||
|
\"geometry\": {
|
||||||
|
\"type\": \"Point\",
|
||||||
|
\"coordinates\": [".reset(get_post_meta($post->ID,'soundmap_marker_lng')).", ".reset(get_post_meta($post->ID,'soundmap_marker_lat'))."]
|
||||||
|
},
|
||||||
|
\"properties\": {
|
||||||
|
\"title\": \"$post->post_title\",
|
||||||
|
\"id\": \"$post->ID\",
|
||||||
|
\"author\": \"$post->post_autor\",
|
||||||
|
\"attachment\": \"$finfo\",
|
||||||
|
\"description\":\"".$post->post_content."\",
|
||||||
|
\"icon\": {
|
||||||
|
\"className\": \"claseSS ".str_replace('-','_',$slug)."\",
|
||||||
|
\"iconSize\": null
|
||||||
|
}
|
||||||
|
}";
|
||||||
|
if ( $i==(count($posts)-1) && $w==(count($posts)-1) ) { print "}";}
|
||||||
|
else { print "},"; }
|
||||||
|
$w=$w+1;
|
||||||
|
endforeach;
|
||||||
|
print "]}\n";
|
||||||
|
?>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<script src='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-markercluster/v0.4.0/leaflet.markercluster.js'></script>
|
||||||
|
<link href='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-markercluster/v0.4.0/MarkerCluster.css' rel='stylesheet' />
|
||||||
|
<link href='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-markercluster/v0.4.0/MarkerCluster.Default.css' rel='stylesheet' />
|
||||||
|
<div class="" id="loading" style="position:fixed;z-index:1000000;font-size:5em;right:50%;top:50%;"><strong>LOADING...</strong></div>
|
||||||
|
<div class="info-layer">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id='map'></div>
|
||||||
|
<script type="text/javascript">
|
||||||
|
|
||||||
|
/*mapboxgl.accessToken = 'pk.eyJ1IjoibHJ1bGxvIiwiYSI6ImNpaDUydjdoNTAwd3BzdGx5bGlhOTh6bXYifQ.tE8QgNbVSgwP8V5LnJWA3w';
|
||||||
|
var map = new mapboxgl.Map({
|
||||||
|
container: 'map', // container id
|
||||||
|
style: 'mapbox://styles/lrullo/cijlyga9m00jvbgkhu7aclgp8', //stylesheet location
|
||||||
|
center: [-1.9806718826293945,43.316810229039795], // starting position
|
||||||
|
zoom: 12 // starting zoom
|
||||||
|
});*/
|
||||||
|
|
||||||
|
|
||||||
|
//init
|
||||||
|
var audio;
|
||||||
|
var id;
|
||||||
|
|
||||||
|
var $loading = $('#loading').hide();
|
||||||
|
$(document)
|
||||||
|
.ajaxStart(function() { $loading.fadeIn();})
|
||||||
|
.ajaxStop(function() { $loading.fadeOut(); });
|
||||||
|
|
||||||
|
function init() {
|
||||||
|
//console.log('init');
|
||||||
|
$('.info-layer').on('click',function(e) {$('.info-layer').hide();});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function audioPlay(s) {
|
||||||
|
audio.stop();
|
||||||
|
audio = new Audio(s);
|
||||||
|
audio.play();
|
||||||
|
}
|
||||||
|
|
||||||
|
function audioStop() {
|
||||||
|
audio.stop();
|
||||||
|
}
|
||||||
|
|
||||||
|
L.mapbox.accessToken = 'pk.eyJ1IjoibHJ1bGxvIiwiYSI6ImNpaDUydjdoNTAwd3BzdGx5bGlhOTh6bXYifQ.tE8QgNbVSgwP8V5LnJWA3w';
|
||||||
|
var mapCluster = L.mapbox.map('map','lrullo.cih52v78z00v4krkrzge97rgg')
|
||||||
|
.setView([41.44876553063473,2.04345703125], 15);
|
||||||
|
//mapCluster.on('click',function(e) {audio.pause();});
|
||||||
|
|
||||||
|
var featureLayer = L.mapbox.featureLayer(walk);
|
||||||
|
|
||||||
|
var clusterGroup = new L.MarkerClusterGroup({
|
||||||
|
iconCreateFunction: function(cluster) {
|
||||||
|
return L.divIcon({
|
||||||
|
iconSize : [30,30],
|
||||||
|
html:'<div style="border:1px;border-color:#fff;text-align:center;color:#fff;width:100%;height:100%;background-color:#aaa;border-radius:100%;padding:5px;font-weight:bold;">'+cluster.getChildCount()+'</div>'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
featureLayer.eachLayer(function(layer) { clusterGroup.addLayer(layer);});
|
||||||
|
mapCluster.addLayer(clusterGroup);
|
||||||
|
|
||||||
|
var me = L.marker([0, 0], {
|
||||||
|
icon: L.mapbox.marker.icon({
|
||||||
|
'marker-color': '#000',
|
||||||
|
'marker-symbol': 'star',
|
||||||
|
'marker-size': 'small'
|
||||||
|
})
|
||||||
|
});
|
||||||
|
|
||||||
|
me.addTo(mapCluster);
|
||||||
|
mapCluster.featureLayer.on('ready', function(e) {
|
||||||
|
<?php if (!$fit) : ?> mapCluster.fitBounds(featureLayer.getBounds()); <?php endif; ?>
|
||||||
|
featureLayer.eachLayer(function(e) {
|
||||||
|
//console.log(e.feature.properties.icon);
|
||||||
|
//e.setIcon(L.divIcon({className: 'claseSS'}));
|
||||||
|
e.setIcon(L.divIcon(e.feature.properties.icon));
|
||||||
|
e.on("click",function(e,a) {
|
||||||
|
e.target.closePopup();
|
||||||
|
var id = this.feature.properties.id;
|
||||||
|
jQuery.get("/index.php/wp-json/wp/v2/marker/"+id, function(data) {
|
||||||
|
//jQuery.get("/mapas/index.php/wp-json/wp/v2/marker/"+id, function(data) {
|
||||||
|
//console.log(data);
|
||||||
|
$('.info-layer').hide();
|
||||||
|
jQuery('.info-layer').html('');
|
||||||
|
var a = jQuery('.info-layer').append('<div class="row"></div>')
|
||||||
|
jQuery.each(data,function(e,p){
|
||||||
|
console.log(e+": "+p);
|
||||||
|
if (Array.isArray(p)) { a.append('<div class="col-md-12"><div class="marker-item" id="marker-'+e+'"><label>'+p[1]+':</label><br/>'+p[0]+"</div></div>"); }
|
||||||
|
else if (e=='title') { a.append('<div class="col-md-12"><div class="marker-title" id="maker-title"><h1>'+p.rendered+'</h1></div></div>'); }
|
||||||
|
else { a.append('<div class="col-md-12"><div class="marker-item" id="marker-'+e+'">'+p+"</div></div>"); }
|
||||||
|
});
|
||||||
|
|
||||||
|
//jQuery('#marker-title').html(data.title.rendered);
|
||||||
|
//jQuery('#marker-description').html(data.date);
|
||||||
|
$('.info-layer').show();
|
||||||
|
});
|
||||||
|
//$('#marker-title').html(this.feature.properties.title);
|
||||||
|
//$('#marker-description').html(this.feature.properties.description);
|
||||||
|
// if (id==e.feature.properties.id) { audio.pause(); id=""; return;}
|
||||||
|
// else { id=e.feature.properties.id; }
|
||||||
|
// if(audio!=undefined) { audio.pause();}
|
||||||
|
// audio = new Audio(e.feature.properties.attachment);
|
||||||
|
// audio.play();
|
||||||
|
});
|
||||||
|
init();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
<?php if ($fit) : ?>getPosition();<?php endif; ?>
|
||||||
|
|
||||||
|
function displayPosition(position) {
|
||||||
|
//console.log("Display position");
|
||||||
|
me.setLatLng(L.latLng([position.coords.latitude,position.coords.longitude]));
|
||||||
|
fg = new L.featureGroup([featureLayer, me]);
|
||||||
|
<?php if (!$fit) :?> mapCluster.fitBounds(fg.getBounds());
|
||||||
|
<?php else:?> mapCluster.setView([position.coords.latitude, position.coords.longitude],18); <?php endif; ?>
|
||||||
|
setTimeout(function() { navigator.geolocation.getCurrentPosition(displayPosition, displayError, {enableHighAccuracy: true, timeout: 5000});},5000);
|
||||||
|
}
|
||||||
|
|
||||||
|
function displayError(error) {
|
||||||
|
var errors = {
|
||||||
|
1: 'Permission denied',
|
||||||
|
2: 'Position unavailable',
|
||||||
|
3: 'Request timeout'
|
||||||
|
};
|
||||||
|
console.log("Error: " + errors[error.code]);
|
||||||
|
switch(errors) {
|
||||||
|
case 1:
|
||||||
|
case 2:
|
||||||
|
map.setView([43.3072873,-2.0089024], 15);
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
alert("timeout");
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function getPosition() {
|
||||||
|
if (navigator.geolocation) {
|
||||||
|
navigator.geolocation.getCurrentPosition(displayPosition, displayError, {enableHighAccuracy: true, timeout:5000});
|
||||||
|
} else {
|
||||||
|
alert("I'm sorry, but geolocation services are not supported by your browser.");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
15
soundmap.php
15
soundmap.php
@ -58,6 +58,7 @@ if (!class_exists('Soundmap')){
|
|||||||
'publicly_queryable' => true,
|
'publicly_queryable' => true,
|
||||||
'show_ui' => true,
|
'show_ui' => true,
|
||||||
'show_in_menu' => true,
|
'show_in_menu' => true,
|
||||||
|
'show_in_rest' => true,
|
||||||
'query_var' => true,
|
'query_var' => true,
|
||||||
'rewrite' => array( 'slug' => 'marker', 'with_front' => false ),
|
'rewrite' => array( 'slug' => 'marker', 'with_front' => false ),
|
||||||
'capability_type' => 'post',
|
'capability_type' => 'post',
|
||||||
@ -581,8 +582,22 @@ if (!class_exists('Soundmap')){
|
|||||||
die();
|
die();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function soundmap_prepare_marker ($data,$p,$r) {
|
||||||
|
$_data = $data->data;
|
||||||
|
$_data['content'] = apply_filters('the_content',get_the_content($p->ID));
|
||||||
|
$fields = get_fields();
|
||||||
|
foreach ($fields as $name=>$value) :
|
||||||
|
$f = get_field_object($name);
|
||||||
|
$_data[str_replace('_','-',$name)] = array($value,$f['label']);
|
||||||
|
endforeach;
|
||||||
|
$data->data = $_data;
|
||||||
|
return $data;
|
||||||
|
}
|
||||||
|
|
||||||
function register_filters(){
|
function register_filters(){
|
||||||
//add_filter( 'pre_get_posts', array($this, 'pre_get_posts'));
|
//add_filter( 'pre_get_posts', array($this, 'pre_get_posts'));
|
||||||
|
add_filter('rest_prepare_marker',array($this,'soundmap_prepare_marker'),12,3);
|
||||||
}
|
}
|
||||||
|
|
||||||
function set_query($query){
|
function set_query($query){
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user