Problemas ao converter de shape para topojson
Pergunta
Estou tentando converter um shapefile de municípios mexicanos em um topojson e exibi-lo usando d3.js usando este tutorial http://bost.ocks.org/mike/map/#converting-data.Consegui convertê-lo, mas não consigo exibi-lo.Qualquer ajuda será muito apreciada.
Este é o meu fluxo de trabalho até agora:
1) Baixe e descompacte o shapefile
wget http://mapserver.inegi.org.mx/MGN/mgm2010v5_0a.zip
unzip mgm2010v5_0a.zip
2) Convertendo para JSON, reprojetando para lat-long e subdividindo o shapefile
ogr2ogr -f GeoJSON -t_srs EPSG:4326 -where "CVE_ENT IN ('09')" df.json Municipios_2010_5A.shp
3) Convertendo para topojson
topojson --id-property OID -p name=OID -p name -o df2.json df.json
4) E criando o código HTML
<!DOCTYPE html>
<meta charset="utf-8">
<style>
/* CSS goes here. */
</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script>
var width = 960,
height = 1160;
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
d3.json("df2.json", function(error, df2) {
svg.append("path")
.datum(topojson.feature(df2, df2.objects.df))
.attr("d", d3.geo.path().projection(d3.geo.mercator()));
});
</script>
Se eu executar o html, recebo uma página em branco.Alguma idéia sobre o que posso estar fazendo de errado?
Solução
A opção mais simples, se você não for específico quanto à projeção, é apenas usar a projeção fornecida pelo shapefile (Lambert Conformal Conic).Usar topojsonsinalizadores de linha de comando --width e --height para redimensionar o shapefile projetado para um tamanho razoável.Por exemplo, se você quiser algo com 960px de largura, você poderia dizer:
topojson --width=960 --margin 20 --simplify=.1 -o mx.json -- municipalities.shp
(Isso também simplifica as coordenadas da tela, convenientemente.)
Um exemplo completo com um Makefile está em bl.ocks.org/9265467:
Se, por outro lado, você deseja especificar sua própria projeção, então é razoável usar ogr2ogr para desfazer a projeção e então definir uma projeção no navegador.Mas, nesse caso, você desejará especificar os parâmetros de projeção de forma adequada.Por exemplo, para recriar a mesma projeção no navegador, você pode dizer:
var projection = d3.geo.conicConformal()
.rotate([102, 0])
.center([0, 24])
.parallels([17.5, 29.5])
.scale(1850)
.translate([width / 2, height / 2]);
(Mexe no centro e na escala conforme desejar para ajustar a janela de visualização desejada.) Essa abordagem alternativa é demonstrada em bl.ocks.org/9265674:
Geralmente prefiro usar coordenadas projetadas (a primeira abordagem, acima), pois são mais rápidas de renderizar e a simplificação é mais eficiente.Por outro lado, se você quiser alterar a projeção dinamicamente (reconhecidamente improvável com um shapefile tão complexo), então projetar no navegador é a melhor opção.E projetar no navegador é bom durante o desenvolvimento porque é mais fácil alterar os parâmetros e recarregar.