Problemas conversión de la forma a Topojson

StackOverflow https://stackoverflow.com//questions/22081863

Pregunta

Estoy tratando de convertir un archivo de forma de municipios mexicanos en un topojson y mostrarlo usando d3.js usando este tutorial http://bost.ocks.org/mike/map/#converting-data .He logrado convertirlo, pero no puedo lograrlo.Cualquier ayuda será apreciada.

Este es mi flujo de trabajo hasta ahora:

1) Descargue y descomprima la shapefile 

wget http://mapserver.inegi.org.mx/MGN/mgm2010v5_0a.zip 
unzip mgm2010v5_0a.zip

2) convertir a JSON, reproyirle a Lat-Long y sumar la shapefile 

ogr2ogr  -f GeoJSON -t_srs EPSG:4326 -where "CVE_ENT IN ('09')" df.json Municipios_2010_5A.shp

3) conversión a topojson 

topojson --id-property OID -p name=OID -p name -o df2.json df.json

4) y creando el 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>

Si ejecuto el HTML, solo recibo una página en blanco.¿Alguna idea sobre lo que podría estar haciendo mal?

¿Fue útil?

Solución

La opción más simple, si no es particular acerca de la proyección, es simplemente usar la proyección proporcionada por el Forma (Lambert Conformal Conex). Use topojson 's - width and --height comandand banderas Para rescate el archivo de forma proyectado a un tamaño razonable. Por ejemplo, si desea algo de 960px de ancho, podría decir: 

topojson --width=960 --margin 20 --simplify=.1 -o mx.json -- municipalities.shp

(Esto también se simplifica en las coordenadas de la pantalla, convenientemente.)

Un ejemplo completo con un makefile está en bl.ocks.org/9265467 :

México

Si, por otro lado, desea especificar su propia proyección, entonces es razonable usar OGR2OGR para deshacer la proyección, y luego definir una proyección en el navegador. Pero en ese caso, querrá especificar adecuadamente los parámetros de proyección. Por ejemplo, para recrear la misma proyección en el navegador, puede decir: 

var projection = d3.geo.conicConformal()
    .rotate([102, 0])
    .center([0, 24])
    .parallels([17.5, 29.5])
    .scale(1850)
    .translate([width / 2, height / 2]);

(Fiddle con el centro y la escala que desea que se ajuste a la vista deseada). Este enfoque alternativo se demuestra en bl.ocks.org/9265674 :

México 2

En general, prefiero usar las coordenadas proyectadas (el primer enfoque, arriba), ya que son más rápidas para renderizar y la simplificación es más eficiente. Por otro lado, si desea cambiar la proyección dinámicamente, es sin duda poco probable con un archivo de forma tan complejo, que la proyección en el navegador es el camino a seguir. Y la proyección en el navegador es agradable durante el desarrollo porque es más fácil cambiar los parámetros y volver a cargar.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top