Visualizar grandes conjuntos de dados com o Leaflet

Ao usar o Leaflet para visualizar um grande conjunto de dados (GeoJSON com recursos de 10.000 pontos), não surpreendentemente o navegador trava ou trava. Uma subamostra de 1000 recursos do mesmo conjunto de dados funciona perfeitamente. Infelizmente, não posso compartilhar o conjunto de dados para que outros possam experimentar.

Alguém tem soluções melhores para visualizar conjuntos de dados tão grandes? (o objetivo final é escalar isso para 2 milhões de recursos). Estou disposto a considerar estruturas de visualização offline, caso alternativas baseadas em navegador como Polymaps ou d3.js etc. sejam consideradas incapazes.

Editar: esqueci de mencionar, o usuário precisa filtrar o conjunto de dados por atributos. Portanto, dentre os N recursos, apenas os recursos n <= N correspondentes podem precisar ser renderizados dinamicamente.

Sou o autor do folheto. Existe um plugin de cluster incrível para isso, Leaflet.markercluster . É muito rápido e eficiente (veja o exemplo de marcadores de 50k), parece e funciona muito bem com animações agradáveis ​​e possui muitas opções para atender às suas necessidades.

Você pode usar o TileMill e renderizar pontos como imagens rasterizadas, com interatividade rápida do UTFGrid . Ele é escalonado para milhões de pontos e polígonos, como esse mapa do censo , pois envia de maneira inteligente apenas os dados necessários para áreas específicas, exatamente quando necessário.

Até onde eu sei, não existem outros métodos rápidos para fazer isso além de ter um servidor WFS muito rápido, que é bastante difícil de manter / escalar para muitos visualizadores.

Divulgação: trabalho para o MapBox , escreveu um pouco do código. Mas o TileMill é gratuito / de código aberto, etc.

Você olhou para o clusterer de folhetos? Uma postagem de blog do autor a descreve aqui

Outra opção que vale a pena procurar pode ser o uso do folheto em combinação com o GIS Cloud . Dê uma olhada nesta demonstração para ver lidar com muitas geometrias muito rapidamente. Muito impressionante. Eu não sou de forma alguma afiliado ao GISCloud.

Você nunca deve exibir milhões de pontos em um mapa. Não apenas por causa dos principais problemas de desempenho, mas também da perspectiva do usuário, porque para eles certamente será difícil interpretar esses dados. Use alguns meios de agregar os dados (agrupamento, agregação às áreas de polígonos etc.) combinados com diferentes tipos de exibição em diferentes níveis de zoom (por exemplo, mostre os dados do ponto "bruto" apenas em níveis muito altos de zoom e use os dados agregados em qualquer outro lugar). Um exemplo seria um site imobiliário, como o zillow.com .

Eu sugiro que você reduza a quantidade renderizada de recursos de pontos: o olho humano não poderá ver 10.000 pontos, para não falar de 2.000.000.

O que você poderia tentar é solicitar dinamicamente o conjunto de dados de um servidor personalizado (que você precisaria configurar), por exemplo

    map = ...
    map.on('moveend', function(e) {
        getGeoJson(e);
    });
    map.on('zoomend', function(e) {
        getGeoJson(e);
    });
    map.setView([2,3], 2);

    function getGeoJson(event) {
        // todo determine current viewport
        $http.get('someGeoJsonDataProvider.someLanguage?currentView=[lat0,lon0,lat1,lon1]').then(function (resp) {
            // todo clear layers
            // new layer
            map.addLayer(
                L.geoJson(resp.data)
            );
        });
    }

Seu servidor calcularia quais pontos retornar, dependendo do que o usuário deseja ver agora. Dependendo do fator de zoom e do recorte, você precisará retornar apenas uma porcentagem muito pequena de pontos sem piorar a experiência do usuário.

Desvantagens: configuração de um servidor (você deve encontrar bibliotecas para filtrar os pontos geográficos) e renderização mais lenta (após cada zoom ou arrastar, é necessário fazer uma solicitação do servidor)

Eu tinha soluções para mapear de 50 a 100 milhões de registros, você precisa usar soluções do lado do servidor para fazer grade e dinamicamente. Você não pode responder nas APIs de mapas da web (Google ou outros) para fazer a renderização do lado do cliente ....

[http://96.231.36.9:8080/rbgis/google_map.html[[1] tente os links acima e veja como