mapbox / geojson-vt Goto Github PK

How can I associate click events with polygons from a polygon geojson which is rendered using geojson vt? I am trying to use leaflet to do that. Thanks for the help.

If we precalculate the smallest containing tile for each feature in a reasonable time, we can do trivial accepts/rejects when clipping really fast, without even looking at feature geometry. This should speed up clipping on low zoom levels considerably. cc @ericfischer

It would be nice to have a way to indicate progress of tile indexing, so that there's some feedback when you load 100M GeoJSON into the stuff.

Use case from @anandthakker, to be able to avoid doing weird things like this:

return geojsonvt(fc, {
    maxZoom: tile[0],
    tolerance: 0,
    buffer: 0,
    indexMaxZoom: tile[0]
}).getTile(tile[0], tile[1], tile[2])

Would it be possible to add an option to use a PostGIS source instead of GeoJSON files ?

Hi,

are there any Options like leaflets onEachFeature() function ?

Greets Markus

Need something like this:

tileFurther(tileIndex, zoom, tileX, tileY);

Takes existing tile index and tiles further to a specific tile. This means finding the closest existing parent tile and then tiling deeper from it to the specified one.

I can't load a geojson file with just points. Is this supported?

Hello,
Can you share an example with Mapbox GL js and geojson-vt ?
Thx

clip z0 into x: -1, 0, 1 tiles, then merge them into one

If you create a canvas tile layer in Leaflet using a tile size other than 256 then the tile indexes within geojson-vt are no longer valid.

For example if you create a canvas tile layer in Leaflet using a tile size of 512:

var tiles = new geojsonvt(geoJsonFeatureCollection);

var canvasTile = L.tileLayer.canvas({
    tileSize: 512
});

canvasTile.drawTile = function(canvas, tilePoint, zoom) {
    ...
    var tile = tiles.getTile(zoom, tilePoint.x, tilePoint.y);
   ...
}

When the drawCanvasTile function is called the tilePoint x and y values are different based on the tile size, though the getTile function always expects it to be an x and y value that corresponds to a tile size of 256. The below table gives example values based on tile size of x and y

I want to use this library to pre-generate a bunch of vector tiles and serve them from disk when a user requests it. Is there a way I can get a list of all possible tiles in tileIndex for pre-generation?

Using the natural earth country boundaries from here.

The first time I request some tiles, I get null, but if I wait, they return values. For example:

var fs = require('fs'),
  gvt = require('geojson-vt');

var c = gvt(JSON.parse(fs.readFileSync('ne_50m_admin_0_countries.geojson', 'utf8')));

console.log(c.getTile(15, 9379, 12533));

setTimeout(function () {
  console.log(c.getTile(15, 9379, 12533));
}, 5000);

This would help debugging and improving clipping / simplification a lot.

var index = geojsonvt({
    "type": "FeatureCollection",
    "features": []
});

index.getTile(15, 0, 0);

index.total; // 131009 tiles

This shouldn't happen. Initially reported at mapbox/mapbox-gl-js#1507

Currently the library doesn't dispose the original geometry of a tile when 4 of its children got drilled down into on demand.

Hi,
Can you share your demo with Nodejs Server, please ?
How to enable this feature with Mapbox GL.js ?
Thank you

Are there any examples of integration with D3.js?

I am following this integration with Leaflet example, which seems intuitive enough, but am hoping to find something more baked out.

We could just filter out same-coord points, but that's probably not enough. We can apply more sophisticated filtering algorithms, but it's tough to make a generic point filtering algorithm that suites any kind of data.

this.tiles grows as you render tiles and this causes memory issues when rendering more than a couple hundred tiles on the server.

Having something like an LRU cache, maybe configureable in size?, would be ideal to get around this.

cc @mourner

Currently even if the data is localized (e.g. all features are in a particular city), geojson-vt still starts clipping from z0, unnecessarily looping through all features on every zoom up to the relevant one.

Instead what we could do is find the bounding tile and only start clipping from it downwards. We'll also have to change the algorithm to derive lower zoom tiles from that top tile.

This will also help fix #1 in a way that doesn't degrade performance.

There should be an executable that, given a GeoJSON file, generates tiles as a folder with files.

I'm finding some quite noticeable features being cut below zoom level 12. See below for an example - the geojson file is made up of a series of polygons.

I've tried playing with the tolerance setting but even at 1 it is still cut.

https://github.com/mapbox/vector-tile-spec/blob/master/1.0.1/vector_tile.proto: use geometry & tags instead of coords & props.

Test case:

var geojsonvt = require('geojson-vt');
console.log(geojsonvt(
    {"type": "Point", "coordinates": [90, 0]},
    {buffer: 2048, extent: 8192}).getTile(0, 0, 0).features.length);

This prints 2 because the point is included twice: one because it's within the normal extent and once because it's within the buffer, which for z0 is wrapping into the opposite side of the tile. It seems to me the buffer should be ignored for z0, rather than generating duplicate features. (What does mapnik do in this case?)

cc @mourner @flippmoke

Any ideas in terms of tweaking the settings for better performance on mobile devices? I am using leaflet 0.7 with the canvas layer plugin. The tiles render fine on mobile, but when performing drastic zoom level changes or drastic panning, the tiles seem to hang/stop rendering. Example. This may be just a limit on the capabilities of mobile processors. I have tested on a samsung tab pro 8.4 and a one touch idol 3 both in chrome. If switching to leaflet-beta would help, I would need to figure out how to draw the tiles with the new grid layer. I don't really want to learn a new js library ie mapbox gl.

This may be a bit similar to #26 but has a different purpose: it would make it possible to make geojson-vt accept data in a stream, without allocating the whole input data in memory first. cc @kkaefer

Should the point projection clamp the latitude to +/-85.05112878?

Otherwise points out of that range get invalid unit projection values.

Not everyone knows or wants to run npm. It would help just to already have a dist. build in the zip file ready to use.

Thanks

Run through all coordinates of all features; for each point, calculate and save the first zoom at which the margin of error for the point encoded into 4096 integers goes below some small threshold.

When considering a tile for cutting, we can determine whether to cut or not by looking at the maximum of calculated zooms for each point in the tile. This way we don't compromise precision while not doing unnecessary tiling.

Currently it only processes the first ring of every polygon. Tiling with proper hole support will be a bit tricky.

Would it be possible to add an API that adds data into the pyramid of tiles (and potentially removes it, but that might be tougher)? This would make live-data use cases very interesting.

It would be great if this could support multiple projections- especially 4326 (equirectangular), or allow for creating a custom CRS like we can in Leaflet.

Don't simplify features for each tile; instead run Douglas-Peucker algorithm (fast O(n log n)) once for all features before tiling, saving the deviation of each coord instead of throwing out points; then for each zoom, simplification will be a matter of picking out points less then a particular threshold.

This will make simplification fast, indicate max zoom up to which simplification matters for each tile upfront, and enable easier simplification-based heuristics.

Hi @mourner,
First of all, thanks for this awesome library!

quick question: I've managed to set up an application that uses geojson vt together with canvas (similar to this example http://bl.ocks.org/Sumbera/raw/c67e5551b21c68dc8299/ ) and have troubles adjusting it for retina displays.
Is there an approach/set of settings I should use in order to make it look good on retina?

thanks!

• each coordinate keeps a switch indicating whether it's from original data or introduced through clipping
• if a tile contains at least one original point, slice deeper (up to z14)
• otherwise stop tiling

This solution should reduce the number of tiles significantly while keeping all the necessary precision, is dead simple to implement, and removes the need for any other heuristics (such as based on num. of features, coordinates, simplification etc.).

It assumes we only need precision for areas where we have actual data points — all lines and polygons going "through" tiles don't need as much precision. Does this sound like a good assumption?

• drilldown with getTile
• stopping on clipped square
• feature as a top-level object
• single geometry as a top-level object
• MultiPoint
• GeometryCollection
• throw if not GeoJSON
• at least one run with debug: 2

Currently you need to specify maxZoom for the first pass tiling run manually depending on the data. It's fine to have it z14 for smaller files like <=20M, but for something like 100M, you hit a JS wall if you specify something more than z4. Instead we need to go indexing and stop automatically if there is a sign that it takes too much memory and will slow down now.

Hi Vladimir, do you have any live sample or could you tell me how may I use your library in a Windows server? Thank you very much in advance

Cesare

The tiling process fails when attempting to process geojson's containing geometries of type == 'Point'.

Is there any plan to support tiling points in the future or is this intentionally not included in the feature set of geojson-vt?

Related: mapbox/vector-tile-js#25