Muestra la capa GeoJSON en la parte superior de una imagen SVG en lugar de un mapa.

Question

Yo soy muy nuevo en los SIG, así que espero que este sea el lugar correcto para preguntar. No estoy seguro si esto va a ser posible.

Esto es lo que quiero lograr:

En resumen, quiero mostrar un conjunto de polígonos, líneas, etc. en un explorador y, a continuación, mostrar una superposición que las marcas específicas de polígonos y líneas etc.

Esta es la forma en que yo pienso que debe ser abordado:

• Tomar un SVG que representa un conjunto de líneas y polígonos.
• Mostrar este SVG utilizando algo como folleto en un navegador, pero sin mostrar un mapa del mundo que parece ser la base de los folíolos, las capas abiertas, etc.
• Superposición de un GeoJSON capa en la parte superior de la SVG.
• Si es posible, quiero las coordenadas en el archivo GeoJSON ser relativa a un punto de referencia en el archivo SVG.

Es esto posible? También, es el último punto posible, que es: la especificación de lo que las coordenadas en el archivo GeoJSON debe ser relativa a, o son siempre interpretadas como GIS coordenadas?

Gracias por todas las aportaciones, Jaco

Answer 1

Yo uso Folleto con los svg como los mapas. Hago esto porque quiero que la funcionalidad de mapas en la parte superior de un plano de planta. En mi experiencia, funciona mucho mejor que Raphael.js (tal vez sólo porque es más reciente?), que mi empresa se utiliza para el mismo propósito, en un proyecto anterior. También he hecho mapas fuera de los planes de piso, pero el SVGs son más rápidos y más suave cuando se utiliza el zoom in o out. SVGs son más pequeñas que una carpeta de baldosa imágenes. Para hacer esto, yo estoy usando Angular.js y el angular-folleto-la directiva. Aquí está el ejemplo usado para empezar. Si no utiliza la directiva, usted puede tener problemas con el "mapa" de la instancia. Esta directiva hace Angular de jugar muy bien con el Prospecto. Yo uso GeoJSONs en la parte superior de la capa de la imagen para mostrar las zonas y puntos, también. Los puntos son relativos a su definido 'centro', al igual que en el caso de un suelo de baldosas de mapa utilizando el Folleto. También he establecido esto en un regular de la página HTML. Básicamente, puede cortar y pegar este Prospecto ejemplo. Yo tenía algo de frustración tratando de averiguar cómo hacer que esta pasando, así que esperemos que esto se pone alguien apunta en la dirección correcta.

Answer 2

Si quiere mostrar SVG, no use una biblioteca de la asignación como Prospecto. En su lugar, utilice un SVG biblioteca como RapahelJS, o muchos otros. Ninguno de los que están específicamente la asignación de las bibliotecas, aunque.

Usted podría experimentar con Kartograph - que es un SVG biblioteca de la asignación, pero nunca he conseguido que funcione bien (yo estoy en Windows y que fue diseñado originalmente para Mac).

Probablemente la mejor solución es el uso de D3. Es un poco complicado, pero una vez que usted consiga la caída de ella, es muy potente. Aquí está una lista de tutoriales para d3, incluyendo algunos de asignación. Yo recomiendo el "Vamos a Hacer un Mapa" tutorial.

Answer 3

Hay dos maneras que usted puede lograr esto:

1. Usted puede utilizar openlayers/folleto con geoserver directamente del servidor de svg. Es fácil, pero las necesidades de geoserver para hacer las cosas para usted.

2. Usted puede utilizar openlayers/folleto y geojson sólo. Representan geojson como tanto la capa de base(polígonos,líneas, etc) y overlayers(puntos,líneas, etc). Aquí es un ejemplo.

3. Puede crear una ruta de acceso de archivo svg y, a continuación, cargar con Raphael/D3 para trazar. Pasos: una.Crear una ruta de acceso de archivo b.Encubierta ruta SVG utilizando Rafael c.Dibujar Json d.Agregar interactividad ejemplo:http://raphaeljs.com/world/

Si la aplicación es de todos los sig con geoserver y openlayers. Si usted desea hacer una sola página, a continuación, ir con svg-ruta de acceso de archivo.

Answer 4

Vi esta discusión, cuando estaba trabajando en algo similar. Muchas veces usted no desea que todos los functionalists de los mapas de la biblioteca. Sólo superposición de geojson en svg es necesario.

Aquí es la herramienta básica geojson2svg (puedo decir de la biblioteca) para convertir geojson a svg, usted encontrará que es muy útil si se hacer muchas cosas por ti mismo.

Pero d3 es estándar y la mejor solución para dicho requisito.