mirror
/
vizicities
kopia lustrzana https://github.com/robhawkes/vizicities
1
0
Forkuj 0
Kod Zgłoszenia Projekty Wydania Wiki Aktywność

Refined height styling (albeit too stubby right now)

master
Robin Hawkes 2016-02-25 12:27:42 +00:00
rodzic 43b2e47a7f
commit 6ba625628e
8 zmienionych plików z 109 dodań i 65 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

80
dist/vizicities.js vendored
Wyświetl plik

@ -335,6 +335,31 @@ return /******/ (function(modules) { // webpackBootstrap
return this.unproject(projectedPoint);
}
// Return pointscale for a given geographic coordinate
}, {
key: 'pointScale',
value: function pointScale(latlon, accurate) {
return this.options.crs.pointScale(latlon, accurate);
}
// Convert from real meters to world units
//
// TODO: Would be nice not to have to pass in a pointscale here
}, {
key: 'metresToWorld',
value: function metresToWorld(metres, pointScale, zoom) {
return this.options.crs.metresToWorld(metres, pointScale, zoom);
}
// Convert from real meters to world units
//
// TODO: Would be nice not to have to pass in a pointscale here
}, {
key: 'worldToMetres',
value: function worldToMetres(worldUnits, pointScale, zoom) {
return this.options.crs.worldToMetres(worldUnits, pointScale, zoom);
}
// Unsure if it's a good idea to expose this here for components like
// GridLayer to use (eg. to keep track of a frustum)
}, {
@ -7903,6 +7928,10 @@ return /******/ (function(modules) { // webpackBootstrap
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
var _geoPoint = __webpack_require__(11);
var _geoPoint2 = _interopRequireDefault(_geoPoint);
var _geoLatLon = __webpack_require__(10);
var _geoLatLon2 = _interopRequireDefault(_geoLatLon);
@ -7939,8 +7968,16 @@ return /******/ (function(modules) { // webpackBootstrap
// Tile center in world coordinates
this._center = this._boundsToCenter(this._boundsWorld);
// Tile center in projected coordinates
this._centerLatlon = this._world.pointToLatLon(VIZI.Point(this._center[0], this._center[1]));
// Length of a tile side in world coorindates
this._side = this._getSide(this._boundsWorld);
// Point scale for tile (for unit conversion)
this._pointScale = this._world.pointScale(this._centerLatlon);
// console.log(this._center, this._centerLatlon, this._pointScale);
}
// Returns true if the tile mesh and texture are ready to be used
@ -8373,9 +8410,7 @@ return /******/ (function(modules) { // webpackBootstrap
}
}, {
key: '_onWorldMove',
value: function _onWorldMove(latlon, point) {
// this._moveBaseLayer(point);
}
value: function _onWorldMove(latlon, point) {}
}, {
key: '_createTile',
value: function _createTile(quadcode, layer) {
@ -8688,14 +8723,14 @@ return /******/ (function(modules) { // webpackBootstrap
style = _this3._options.style(feature);
}
// console.log(style);
var coordinates = feature.geometry.coordinates;
// Skip if geometry is a point
//
// This should be a user-defined filter as it would be wrong to assume
// that people won't want to output points
//
// The default use-case should be to output points in a different way
if (!coordinates[0] || !coordinates[0][0] || !Array.isArray(coordinates[0][0])) {
return;
}
@ -8717,14 +8752,20 @@ return /******/ (function(modules) { // webpackBootstrap
groupedVertices.push(earcutData.vertices.slice(i, i + earcutData.dimensions));
}
var extruded = (0, _utilExtrudePolygon2['default'])(groupedVertices, faces);
var height = 0;
if (style.height) {
// console.log(style.height, this._world.metresToWorld(style.height, this._pointScale), this._pointScale);
height = _this3._world.metresToWorld(style.height, _this3._pointScale);
}
var extruded = (0, _utilExtrudePolygon2['default'])(groupedVertices, faces, {
bottom: 0,
top: height
});
colour.set(style.color);
// allVertices.push(earcutData.vertices);
// allColours.push([colour.r, colour.g, colour.b]);
// allFaces.push(faces);
allVertices.push(extruded.positions);
allColours.push([colour.r, colour.g, colour.b]);
allFaces.push(extruded.faces);
@ -8732,9 +8773,6 @@ return /******/ (function(modules) { // webpackBootstrap
facesCount += extruded.faces.length;
});
// console.log(allVertices);
// return;
// Skip if no faces
//
// Need to check way before this if there are no faces, before even doing
@ -8773,22 +8811,6 @@ return /******/ (function(modules) { // webpackBootstrap
for (var j = 0; j < _faces.length; j++) {
// Array of vertex indexes for the face
index = _faces[j][0];
//
// var ax = _vertices[index * dim] + offset.x;
// var ay = 0;
// var az = _vertices[index * dim + 1] + offset.y;
//
// index = _faces[j][1];
//
// var bx = _vertices[index * dim] + offset.x;
// var by = 0;
// var bz = _vertices[index * dim + 1] + offset.y;
//
// index = _faces[j][2];
//
// var cx = _vertices[index * dim] + offset.x;
// var cy = 0;
// var cz = _vertices[index * dim + 1] + offset.y;
var ax = _vertices[index][0] + offset.x;
var ay = _vertices[index][1];

8
dist/vizicities.min.js vendored
Wyświetl plik

File diff suppressed because one or more lines are too long

2
dist/vizicities.min.js.map vendored
Wyświetl plik

File diff suppressed because one or more lines are too long

13
examples/basic/main.js
Wyświetl plik

@ -11,11 +11,20 @@ var imageTileLayer = VIZI.ImageTileLayer('http://{s}.basemaps.cartocdn.com/light
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
}).addTo(world);
var topoJSONTileLayer = VIZI.TopoJSONTileLayer('https://vector.mapzen.com/osm/buildings/{z}/{x}/{y}.topojson', {
var topoJSONTileLayer = VIZI.TopoJSONTileLayer('https://vector.mapzen.com/osm/buildings/{z}/{x}/{y}.topojson?api_key=vector-tiles-NT5Emiw', {
style: function(feature) {
var height;
if (feature.properties.height) {
height = feature.properties.height;
} else {
height = 10 + Math.random() * 10;
}
return {
// color: (feature.properties.area > 10000) ? '#ff0000' : '#0000ff'
color: '#ffffff'
color: '#ffffff',
height: height
};
},
// filter: function(feature) {

19
src/World.js
Wyświetl plik

@ -163,6 +163,25 @@ class World extends EventEmitter {
return this.unproject(projectedPoint);
}
// Return pointscale for a given geographic coordinate
pointScale(latlon, accurate) {
return this.options.crs.pointScale(latlon, accurate);
}
// Convert from real meters to world units
//
// TODO: Would be nice not to have to pass in a pointscale here
metresToWorld(metres, pointScale, zoom) {
return this.options.crs.metresToWorld(metres, pointScale, zoom);
}
// Convert from real meters to world units
//
// TODO: Would be nice not to have to pass in a pointscale here
worldToMetres(worldUnits, pointScale, zoom) {
return this.options.crs.worldToMetres(worldUnits, pointScale, zoom);
}
// Unsure if it's a good idea to expose this here for components like
// GridLayer to use (eg. to keep track of a frustum)
getCamera() {

9
src/layer/tile/Tile.js
Wyświetl plik

@ -1,3 +1,4 @@
import Point from '../../geo/Point';
import LatLon from '../../geo/LatLon';
import THREE from 'three';
@ -27,8 +28,16 @@ class Tile {
// Tile center in world coordinates
this._center = this._boundsToCenter(this._boundsWorld);
// Tile center in projected coordinates
this._centerLatlon = this._world.pointToLatLon(VIZI.Point(this._center[0], this._center[1]));
// Length of a tile side in world coorindates
this._side = this._getSide(this._boundsWorld);
// Point scale for tile (for unit conversion)
this._pointScale = this._world.pointScale(this._centerLatlon);
// console.log(this._center, this._centerLatlon, this._pointScale);
}
// Returns true if the tile mesh and texture are ready to be used

39
src/layer/tile/TopoJSONTile.js
Wyświetl plik

@ -203,14 +203,14 @@ class TopoJSONTile extends Tile {
style = this._options.style(feature);
}
// console.log(style);
var coordinates = feature.geometry.coordinates;
// Skip if geometry is a point
//
// This should be a user-defined filter as it would be wrong to assume
// that people won't want to output points
//
// The default use-case should be to output points in a different way
if (!coordinates[0] || !coordinates[0][0] || !Array.isArray(coordinates[0][0])) {
return;
}
@ -232,14 +232,20 @@ class TopoJSONTile extends Tile {
groupedVertices.push(earcutData.vertices.slice(i, i + earcutData.dimensions));
}
var extruded = extrudePolygon(groupedVertices, faces);
var height = 0;
if (style.height) {
// console.log(style.height, this._world.metresToWorld(style.height, this._pointScale), this._pointScale);
height = this._world.metresToWorld(style.height, this._pointScale);
}
var extruded = extrudePolygon(groupedVertices, faces, {
bottom: 0,
top: height
});
colour.set(style.color);
// allVertices.push(earcutData.vertices);
// allColours.push([colour.r, colour.g, colour.b]);
// allFaces.push(faces);
allVertices.push(extruded.positions);
allColours.push([colour.r, colour.g, colour.b]);
allFaces.push(extruded.faces);
@ -247,9 +253,6 @@ class TopoJSONTile extends Tile {
facesCount += extruded.faces.length;
});
// console.log(allVertices);
// return;
// Skip if no faces
//
// Need to check way before this if there are no faces, before even doing
@ -288,22 +291,6 @@ class TopoJSONTile extends Tile {
for (var j = 0; j < _faces.length; j++) {
// Array of vertex indexes for the face
index = _faces[j][0];
//
// var ax = _vertices[index * dim] + offset.x;
// var ay = 0;
// var az = _vertices[index * dim + 1] + offset.y;
//
// index = _faces[j][1];
//
// var bx = _vertices[index * dim] + offset.x;
// var by = 0;
// var bz = _vertices[index * dim + 1] + offset.y;
//
// index = _faces[j][2];
//
// var cx = _vertices[index * dim] + offset.x;
// var cy = 0;
// var cz = _vertices[index * dim + 1] + offset.y;
var ax = _vertices[index][0] + offset.x;
var ay = _vertices[index][1];

4
src/layer/tile/TopoJSONTileLayer.js
Wyświetl plik

@ -45,9 +45,7 @@ class TopoJSONTileLayer extends TileLayer {
this._calculateLOD();
}
_onWorldMove(latlon, point) {
// this._moveBaseLayer(point);
}
_onWorldMove(latlon, point) {}
_createTile(quadcode, layer) {
var options = {};