kopia lustrzana https://github.com/robhawkes/vizicities
74 wiersze
2.2 KiB
JavaScript
Executable File
74 wiersze
2.2 KiB
JavaScript
Executable File
// London
|
|
var coords = [51.505, -0.09];
|
|
|
|
var world = VIZI.world('world', {
|
|
skybox: true,
|
|
postProcessing: true
|
|
}).setView(coords);
|
|
|
|
// Set position of sun in sky
|
|
world._environment._skybox.setInclination(0.3);
|
|
|
|
// Add controls
|
|
VIZI.Controls.orbit().addTo(world);
|
|
|
|
// CartoDB basemap
|
|
VIZI.imageTileLayer('http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png', {
|
|
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, © <a href="http://cartodb.com/attributions">CartoDB</a>'
|
|
}).addTo(world);
|
|
|
|
// Buildings and roads from Tilezen (polygons and linestrings)
|
|
VIZI.mvtTileLayer('https://tile.nextzen.org/tilezen/vector/v1/all/{z}/{x}/{y}.mvt?api_key=-P8vfoBlQHWiTrDduihXhA', {
|
|
interactive: false,
|
|
style: function(feature) {
|
|
var height;
|
|
|
|
if (feature.properties.height) {
|
|
height = feature.properties.height;
|
|
} else {
|
|
height = 10 + Math.random() * 10;
|
|
}
|
|
|
|
return {
|
|
height: height,
|
|
lineColor: '#f7c616',
|
|
lineWidth: 1,
|
|
lineTransparent: true,
|
|
lineOpacity: 0.2,
|
|
lineBlending: THREE.AdditiveBlending,
|
|
lineRenderOrder: 2
|
|
};
|
|
},
|
|
layers: ['buildings', 'roads'],
|
|
filter: function(feature) {
|
|
// Don't show points
|
|
return feature.geometry.type !== 'Point';
|
|
},
|
|
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, <a href="http://whosonfirst.mapzen.com#License">Who\'s On First</a>.'
|
|
}).addTo(world);
|
|
|
|
// London Underground lines
|
|
VIZI.geoJSONLayer('https://rawgit.com/robhawkes/4acb9d6a6a5f00a377e2/raw/30ae704a44e10f2e13fb7e956e80c3b22e8e7e81/tfl_lines.json', {
|
|
output: true,
|
|
interactive: true,
|
|
style: function(feature) {
|
|
var colour = feature.properties.lines[0].colour || '#ffffff';
|
|
|
|
return {
|
|
lineColor: colour,
|
|
lineHeight: 20,
|
|
lineWidth: 3,
|
|
lineTransparent: true,
|
|
lineOpacity: 0.5,
|
|
lineBlending: THREE.AdditiveBlending,
|
|
lineRenderOrder: 2
|
|
};
|
|
},
|
|
onEachFeature: function(feature, layer) {
|
|
layer.on('click', function(layer, point2d, point3d, intersects) {
|
|
console.log(layer, point2d, point3d, intersects);
|
|
});
|
|
},
|
|
attribution: '© Transport for London.'
|
|
}).addTo(world);
|