Skip to content

Commit

Permalink
fix json tiles and sql
Browse files Browse the repository at this point in the history
  • Loading branch information
dschwen committed Jul 11, 2022
1 parent 82de46e commit 3f84715
Show file tree
Hide file tree
Showing 3 changed files with 87 additions and 67 deletions.
60 changes: 37 additions & 23 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,30 +1,37 @@
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@media (min-width: 842px) {
#content {
width: 800px; /*height: 100%;*/
#content {
width: 800px;
/*height: 100%;*/
position: absolute;
left: 50%;
margin-left: -420px;
margin-left: -420px;
border: 1px solid gray;
border-top: none;
}

body {
background-color: #eeeeee;
}
}
#content {

#content {
padding: 20px;
background-color: white;
}

body {
margin: 0;
}

h1 {
font-family: sans-serif;
}

p {
margin-top: 2em;
}
Expand All @@ -38,29 +45,36 @@
//ps = e.source;
}
if (e.data == 'kml') {
e.source.postMessage('1,1','*');
e.source.postMessage('1,1', '*');
}
}
$(window).on('message',wmaMessageHub);
$(window).on('message', wmaMessageHub);
</script>
</head>

<body>
<div id="content">
<h1>WikiMiniAtlas</h1>
<!--<iframe scrolling="no" frameborder="0" width="800" height="600" src="iframe.html?40.7833_-73.966_800_600_en_13_en" style="width:800px; height:600px; border: 1px solid gray; padding: 0px; margin: 0px; resize: both">-->
<iframe id="map" scrolling="no" frameborder="0" width="800" height="600" src="iframe_dev.html?wma=0.0_0.0_800_600_commons_1_en&globe=Earth&lang=en" style="width:800px; height:600px; border: 1px solid gray; padding: 0px; margin: 0px; resize: both">
You need a browser that supports iframes
</iframe>

<p><b>WikiMiniAtlas</b> is a JavaScript plugin to display a draggable, zoomable, and clickable worldmap (as well as Moon, Mars, Venus, Mercury, Io and Titan imagery) in geocoded Wikipedia articles. The map contains links to all other geocoded articles in Wikipedia and can be magnified down to streetlevel. 3D building models are displayed in modern browsers.</p>
<a href="https://meta.wikimedia.org/wiki/WikiMiniAtlas">More...</a>
</div>
<script>
var hash = document.location.hash;
if (hash) {
var lang = hash.substr(1);
$('#map').attr('src', 'iframe_dev.html?wma=0.0_0.0_800_600_' + lang + '_1_' + lang + '&globe=Earth&lang=' + lang);
}
</script>
<div id="content">
<h1>WikiMiniAtlas</h1>
<!--<iframe scrolling="no" frameborder="0" width="800" height="600" src="iframe.html?40.7833_-73.966_800_600_en_13_en" style="width:800px; height:600px; border: 1px solid gray; padding: 0px; margin: 0px; resize: both">-->
<iframe id="map" scrolling="no" frameborder="0" width="800" height="600"
src="iframe_dev.html?wma=0.0_0.0_800_600_commons_1_en&globe=Earth&lang=en"
style="width:800px; height:600px; border: 1px solid gray; padding: 0px; margin: 0px; resize: both">
You need a browser that supports iframes
</iframe>

<p><b>WikiMiniAtlas</b> is a JavaScript plugin to display a draggable, zoomable, and clickable worldmap (as well as
Moon, Mars, Venus, Mercury, Io and Titan imagery) in geocoded Wikipedia articles. The map contains links to all
other geocoded articles in Wikipedia and can be magnified down to streetlevel. 3D building models are displayed in
modern browsers.</p>
<a href="https://meta.wikimedia.org/wiki/WikiMiniAtlas">More...</a>
</div>
<script>
var hash = document.location.hash;
if (hash) {
var lang = hash.substr(1);
$('#map').attr('src', 'iframe_dev.html?wma=40.572795868,0_-74.040813_800_600_' + lang + '_13_' + lang + '&globe=Earth&lang=' + lang);
}
</script>
</body>

</html>
59 changes: 28 additions & 31 deletions tiles/jsontile.php
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,12 @@ function beginsWith($str, $sub) {
$urx = ($x+1) * 60.0 / (1<<$z);
$ury = 90.0 - ( ($y*60.0) / (1<<$z) );

// make sure the longitude is between -180 and 180
if ($urx>180.0) {
$urx -= 360.0;
$llx -= 360.0;
}

// add ten pixel worth of padding
$dx = ($urx-$llx)*10/128;
$dy = ($ury-$lly)*10/128;
Expand All @@ -84,24 +90,21 @@ function beginsWith($str, $sub) {
$ury += $dy;

// get mercator bounds
$mllx = deg2rad($llx>180?($llx-360.0):$llx)*6378137.0;
$mllx = deg2rad($llx)*6378137.0;
$mlly = log(tan(M_PI_4 + deg2rad($lly) / 2.0)) * 6378137.0;
$murx = deg2rad($urx>180?($urx-360.0):$urx)*6378137.0;
$murx = deg2rad($urx)*6378137.0;
$mury = log(tan(M_PI_4 + deg2rad($ury) / 2.0)) * 6378137.0;


$tags = array( "highway", "railway", "waterway", "landuse", "leisure", "building", "natural", "amenity", "name", "boundary", "osm_id","layer","access","route", "historic", "tunnel", "aeroway", "aerialway", "tourism" );
$tags = array( "highway", "railway", "waterway", "landuse", "leisure", "building", "natural", "amenity", "name", "boundary", "osm_id","layer","access","route", "historic", "tunnel", "aeroway", "aerialway", "tourism", "man_made" );
$taglist = '"'.implode($tags,'", "').'"';
$tagnum = count($tags);
$intersect = "
ST_Intersection(
way,
ST_SetSRID('BOX3D($mllx $mlly, $murx $mury)'::box3d,3857)
)";
$box = "ST_Transform(ST_SetSRID('BOX3D( $llx $lly, $urx $ury )'::box3d,4326),3857)";
$intersect = "ST_Intersection(way, $box)";
//transform( ST_GeomFromText('POLYGON(($llx $ury, $urx $ury, $urx $lly, $llx $lly, $llx $ury))', 4326 ), 3857 )
$table = array(
array('planet_osm_polygon','building IS NULL AND not exist(hstore(tags),\'building:part\') AND',$intersect),
array('planet_osm_line','building IS NULL AND not exist(hstore(tags),\'building:part\') AND',$intersect)
$table = array(
array('planet_osm_polygon','building IS NULL AND (tags IS NULL OR NOT exist(hstore(tags),\'building:part\')) AND',$intersect),
array('planet_osm_line','building IS NULL AND (tags IS NULL OR NOT exist(hstore(tags),\'building:part\')) AND',$intersect)
);

// also return buildings for large zoom levels
Expand All @@ -116,14 +119,14 @@ function beginsWith($str, $sub) {
for( $i=0; $i<count($table); $i++ ) {
// build query for the cropped data without buildings
$query = "
select
select
ST_AsGeoJSON( ST_Transform(".$table[$i][2].",4326), 9 ),
tags, $taglist
from ".$table[$i][0]."
where
".$table[$i][1]."
ST_IsValid(way) AND way && ST_SetSRID('BOX3D($mllx $mlly, $murx $mury)'::box3d,3857);
";
".$table[$i][1]." ST_IsValid(way) AND ST_Intersects(way, $box);";
// ".$table[$i][1]." ST_IsValid(way) AND way && $box;";
// ST_IsValid(way) AND way && ST_SetSRID('BOX3D($llx $lly, $urx $ury)'::box3d,4326);

// debug
if ($a === 'query') {
Expand All @@ -138,7 +141,7 @@ function beginsWith($str, $sub) {
}

while ($row = pg_fetch_row($result)) {
// decode geometry
// decode geometry
$thisgeo = json_decode($row[0]);

// is the geometry empty? then fetch next
Expand All @@ -157,7 +160,7 @@ function beginsWith($str, $sub) {
} else {
$tagfound[$tags[$j]] = 1;
}

// server side index
if( array_key_exists($tags[$j], $idx) ) {
$idx[$tags[$j]][] = count($geo);
Expand All @@ -171,8 +174,8 @@ function beginsWith($str, $sub) {
if( $row[1] !== null ) {
$hstore = json_decode('{' . str_replace('"=>"', '":"', $row[1]) . '}', true);
foreach( $hstore as $j => $val ) {
//if( beginsWith($j,'name:') || beginsWith($j,'tiger:') || beginsWith($j,'nist:') ) continue;
if( beginsWith($j,'tiger:') || beginsWith($j,'nist:') ) continue;
//if( beginsWith($j,'name:') || beginsWith($j,'tiger:') || beginsWith($j,'nist:') ) continue;
if( beginsWith($j,'tiger:') || beginsWith($j,'nist:') ) continue;
$type[$j]=$val;

if (array_key_exists($j, $tagfound)) {
Expand All @@ -197,27 +200,21 @@ function beginsWith($str, $sub) {

if( $a === 'print' ) exit;

// make sure the longitude is between -180 and 180
if ($urx>180.0) {
$urx -= 360.0;
$llx -= 360.0;
}

// get landmass polygons and coastlines
$table = array('land_polygons','coastlines');
for ($i=0; $i<2; $i++) {
// set up query
$query = "
select
ST_AsGeoJSON(
ST_Intersection(
select
ST_AsGeoJSON(
ST_Intersection(
ST_SetSRID(wkb_geometry, 4326),
ST_SetSRID('BOX3D($llx $lly, $urx $ury)'::box3d, 4326)
)
, 9 )
from ".$table[$i]."
where
wkb_geometry && ST_SetSRID('BOX3D($llx $lly, $urx $ury)'::box3d,4326);
ST_Intersects(wkb_geometry, ST_SetSRID('BOX3D($llx $lly, $urx $ury)'::box3d,4326));
";

// perform query
Expand Down Expand Up @@ -248,7 +245,7 @@ function beginsWith($str, $sub) {
}
}

//$s = json_encode( array( "data" => $geo, "x" => $x, "y" => $y, "z" => $z, "f" => $tagfound, "v" => 6, "idx" => $idx, "mbbox" => "$mllx $mlly, $murx $mury", "bbox" => "$llx $lly, $urx $ury" ) );
//$s = json_encode( array( "data" => $geo, "x" => $x, "y" => $y, "z" => $z, "f" => $tagfound, "v" => 6, "idx" => $idx, "t" => time(), "mbbox" => "$mllx $mlly, $murx $mury", "bbox" => "$llx $lly, $urx $ury" ) );
$s = json_encode( array( "data" => $geo, "x" => $x, "y" => $y, "z" => $z, "f" => $tagfound, "v" => 6, "idx" => $idx, "t" => time() ) );

// do not cache purge action
Expand All @@ -262,7 +259,7 @@ function beginsWith($str, $sub) {
// write to cache
if( !is_dir( "jsontile/$z/$y" ) ) {
$oldumask = umask(0);
mkdir("jsontile/$z/$y",0755);
mkdir("jsontile/$z/$y",0755);
umask($oldumask);
}

Expand Down
35 changes: 22 additions & 13 deletions wmajt_dev.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,18 +33,26 @@ var wmajt = (function () {
['landuse', { grass: 1 },
[{ globalAlpha: 0.3, fillStyle: "rgb(0,160,0)" }, { globalAlpha: 1 }]
],
['waterway', { riverbank: 1, dock: 1 },
[{ fillStyle: "rgb(158,199,243)" }]
],
['waterway', { dam: 1 },
[{ fillStyle: "rgb(150,150,150)" }]
],
['leisure', {
park: 1, orchard: 1, meadow: 1, village_green: 1, golf_course: 1, track: 1,
forrest: 1, recreation_ground: 1, dog_park: 1, garden: 1, pitch: 1, stadium: 1
forrest: 1, recreation_ground: 1, dog_park: 1
},
[{ fillStyle: "rgb(200,224,200)" }]
],
['leisure', {
garden: 1, pitch: 1, stadium: 1
},
[{ fillStyle: "rgb(180,224,180)" }]
],
['leisure', { swimming_pool: 1 },
[{ fillStyle: "rgb(200,200,224)" }]
],
['waterway', { riverbank: 1, dock: 1 },
[{ fillStyle: "rgb(158,199,243)" }]
],
['natural', { beach: 1, sand: 1 },
[{ fillStyle: "rgb(250,242,175)" }]
],
Expand All @@ -64,11 +72,19 @@ var wmajt = (function () {
[{ fillStyle: "rgb(158,199,243)" },
{ lineWidth: 1, strokeStyle: "rgb(158,199,243)" }]
],
['natural', { reef: 1 },
[{ fillStyle: "rgb(148,189,223)" },
{ lineWidth: 1, strokeStyle: "rgb(158,199,243)" }]
],
['man_made', { wastewater_plant: 1, breakwater: 1, pier: 1 },
[{ fillStyle: "rgb(168,178,178)" },
{ lineWidth: 1, strokeStyle: "rgb(140,145,145)" }]
],
['natural', { glacier: 1 },
[{ fillStyle: "rgb(230,245,255)" },
{ lineWidth: 1, strokeStyle: "rgb(255,255,255)" }]
],
['amenity', { university: 1 },
['amenity', { university: 1, school: 1 },
[{ lineWidth: 0.5, strokeStyle: "rgb(240,225,183)" }]
],
['amenity', { parking: 1 },
Expand Down Expand Up @@ -96,10 +112,6 @@ var wmajt = (function () {
[{ fillStyle: "rgb(210,195,195)" },
{ lineWidth: 1, strokeStyle: "rgb(127,127,127)" }]
],
['natural', { water: 1, bay: 1 },
[{ fillStyle: "rgb(158,199,243)" },
{ lineWidth: 1, strokeStyle: "rgb(158,199,243)" }]
],
/*['building', {yes: 1, block: 1, office: 1, courthouse: 1, church: 1, school: 1, cathedral: 1, residential: 1, house: 1, hut: 1,
university: 1, hospital: 1, bunker: 1, train_station: 1, chapel: 1, industrial: 1, commercial: 1, retail: 1, hotel: 1,
apartments: 1, synagogue: 1},
Expand Down Expand Up @@ -147,10 +159,7 @@ var wmajt = (function () {
['route', { ferry: 1 },
[{ dash: [4, 4], lineWidth: 2, strokeStyle: "rgb(126,159,194)" }]
],
['highway', { pedestrian: 1 },
[{ lineWidth: 5, strokeStyle: "rgb(255,255,255)" }]
],
['highway', { footway: 1, pedestrian: 1, path: 1 },
['highway', { footway: 1, pedestrian: 1, path: 1, cycleway: 1 },
[{ lineWidth: 2, strokeStyle: "rgb(198,178,178)" }]
//[ { lineWidth: 2, strokeStyle: "rgb(168,148,148)" } ]
],
Expand Down

0 comments on commit 3f84715

Please sign in to comment.