GitHub - joker-x/Leaflet.geoCSV: Plugin para Leaflet que permite cargar un archivo CSV como capa geoJSON // Leaflet plugin for loading a CSV file as geoJSON layer.
Skip to content
Sign up
Why GitHub?
Features →
Mobile →
Actions →
Codespaces →
Packages →
Security →
Code review →
Project management →
Integrations →
GitHub Sponsors →
Customer stories →
Security →
Team
Enterprise
Explore
Explore GitHub →
Learn & contribute
Topics →
Collections →
Trending →
Learning Lab →
Open source guides →
Connect with others
The ReadME Project →
Events →
Community forum →
GitHub Education →
GitHub Stars program →
Marketplace
Pricing
Plans →
Compare plans →
Contact Sales →
Nonprofit →
Education →
In this repository
All GitHub
↵
Jump to
↵
No suggested jump to results
In this repository
All GitHub
↵
Jump to
↵
In this user
All GitHub
↵
Jump to
↵
In this repository
All GitHub
↵
Jump to
↵
Sign in
Sign up
{{ message }}
joker-x
/
Leaflet.geoCSV
Watch
10
Star
100
Fork
61
Plugin para Leaflet que permite cargar un archivo CSV como capa geoJSON // Leaflet plugin for loading a CSV file as geoJSON layer.
100
stars
61
forks
Star
Watch
Code
Issues
1
Pull requests
0
Actions
Projects
0
Security
Insights
More
Code
Issues
Pull requests
Actions
Projects
Security
Insights
master
3
branches
1
tag
Go to file
Code
Clone
HTTPS
GitHub CLI
Use Git or checkout with SVN using the web URL.
Work fast with our official CLI.
Learn more.
Open with GitHub Desktop
Download ZIP
Launching GitHub Desktop
If nothing happens, download GitHub Desktop and try again.
Go back
Launching GitHub Desktop
If nothing happens, download GitHub Desktop and try again.
Go back
Launching Xcode
If nothing happens, download Xcode and try again.
Go back
Launching Visual Studio
If nothing happens, download the GitHub extension for Visual Studio and try again.
Go back
Latest commit
joker-x
Update README.md
…
5ec7118
Sep 10, 2020
Update README.md
5ec7118
Git stats
50
commits
Files
Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
examples
Update Leaflet to 1.7.1
Sep 9, 2020
lib
Update Leaflet to 1.7.1
Sep 9, 2020
.gitignore
version 0.5
Jan 1, 2013
README.md
Update README.md
Sep 10, 2020
leaflet.geocsv-src.js
Improve csv parser to support multiline fields
Sep 9, 2020
leaflet.geocsv.js
Improve csv parser to support multiline fields
Sep 9, 2020
leaflet.geocsv.js.gz
Improve csv parser to support multiline fields
Sep 9, 2020
package.json
Add package.json
Sep 9, 2020
View code
README.md
Leaflet GeoCSV
English: Leaflet plugin for loading a CSV file as geoJSON layer.
Castellano: Plugin para Leaflet que permite cargar un archivo CSV como capa geoJSON.
News
Add WKT support for POINT, LINESTRING and POLYGON in development branch.
See test example
Why GeoCSV?
Ease of use: A CSV (comma-separated values) file is a simple and open file format that stores tabular data in
plain-text form. Virtually all spreadsheet and database software can import/export this file format.
Save bandwidth: When used to display markers, GeoJSON files can be up to four times as large as a CSV file
containing the same information. This plugin provides the ability to download a CSV file that is then parsed into a
GeoJSON document on the client side, saving you bandwidth and reducing load times. In similar scenarios, we recommend
using GeoCSV together with MarkerCluster as in the
Bankia Offices Map Example.
Download
Plugin only (2.4k, uncompressed): leaflet.geocsv.js
Full Repository (includes plugin, all prerequisites and examples): .ZIP or .TAR.GZ
Options
GeoCSV inherits the configuration options and methods of its parent object, the GeoJSON layer, and further defines the following of its own:
titles: An array of field titles in the same order in which they appear within the CSV file. GeoCSV only requires the presence of two field titles, lat and lng (latitude and longitude, respectively); all others field titles are permitted, omitting spaces, capitalization, accent characters, etc. By default, titles: ['lat', 'lng', 'popup']
latitudeTitle: The title used for the latitude value of the feature. By default, latitudeTitle: 'lat'.
longitudeTitle: The title used for the longitude value of the feature. By default, longitudeTitle: 'lng'.
lineSeparator: The string delimiting lines within the CSV file (between each GeoJSON feature). By default, lineSeparator: '\n'.
fieldSeparator: The string delimiting individual fields within each feature. By default, fieldSeparator: ';'.
deleteDoubleQuotes: A boolean indicating if double quotes surrounding individual field values should be removed. By default, true.
firstLineTitles: A boolean indicating if the first line of the CSV file contains field titles. If set to false, the plugin will ignore the titles configuration option. By default, false.
Methods
getPropertyTitle( propertyName ): When passed a property name (string), returns the associated property title.
getPropertyName( propertyTitle ): When passed a property title (string), returns the associated property name.
Use
Include the plugin JavaScript file after leaflet.js:
Create a GeoCSV layer by instantiating the class or calling L.geoCsv(). Where csvFileContents is the content of a CSV file and options is an object literal as described in the previous section: var csvLayer = L.geoCsv(csvFileContents, options);
An example, using jQuery to read a CSV file, and adding a GeoCSV layer to a map:
(function() {
'use strict';
var map = L.map('mapContainer');
$.get('data.csv', function(csvContents) {
var geoLayer = L.geoCsv(csvContents, {firstLineTitles: true, fieldSeparator: ','});
map.addLayer(geoLayer);
});
});
Examples
Complete examples can be found within the examples subdirectory of the repository:
Configuration Options Test
Load custom icons from CSV
Data Passing Through the URL
Bankia Offices (GeoCSV + MarkerCluster)
¿Por qué GeoCSV?
Comodidad: CSV es un formato abierto muy simple para representar un conjunto de datos en forma de tabla. Cualquier hoja de cálculo, por ejemplo, puede importar/exportar fácilmente a este formato.
Por razones de peso: Cuando se trata de representar un conjunto grande de marcadores en un mapa, el fichero geoJSON generado puede ocupar 4 veces más que la misma información contenida en un CSV. Este plugin permite que transmitas el fichero CSV y realiza la conversión al geoJSON equivalente en el lado del cliente, ahorrando ancho de banda a tu servidor y disminuyendo el tiempo de carga de tu página. En este escenario recomendamos usarlo junto al fantástico plugin MarkerCluster. Ejemplo: Mapa de las sucursales de Bankia: GeoCSV+MarkerCluster
Descarga
leaflet.geocsv.js: Sólo plugin 2,4K. Menos de 1K comprimido.
Repositorio completo .ZIP .TAR.GZ: Incluye plugin, ejemplos y librerías utilizadas en los mismos.
Opciones
Leaflet GeoCSV hereda de GeoJSON, por lo que pueden usarse todas las opciones y métodos de la superclase.
Además define las siguientes opciones propias:
titles: Array con los rótulos o títulos de los campos en el orden en el que aparecen en el CSV. Hay dos títulos especiales que deben aparecer siempre con el mismo nombre: 'lat' → latitud y 'lng' → longitud. El resto puede adoptar cualquier forma, admitiendo espacios, mayúsculas, tildes, etc. Por defecto ['lat', 'lng', 'popup']
latitudeTitle: Título del campo latitud. Por defecto latitudeTitle: 'lat'.
longitudeTitle: Título del campo longitud. Por defecto longitudeTitle: 'lng'.
lineSeparator: Carácter o cadena de caracteres que usarán para separar las líneas del archivo CSV, cada una de las features. Por defecto '\n'
fieldSeparator: Carácter o cadena de caracteres que usarán para separar los campos del archivo CSV. Por defecto ';'
deleteDoubleQuotes: Valor booleano que indica si se desea borrar las comillas que delimitan los campos del archivo CSV. Por defecto true
firstLineTitles: Valor booleano que indica si la primera línea del archivo CSV contiene los rótulos de los campos. Por defecto false. Si se pone a true se ignorará la opción titles.
Métodos
getPropertyTitle( nombre_propiedad ): Devuelve el rótulo asociado al nombre de la propiedad que recibe como parámetro.
getPropertyName( nombre_título ): Devuelve el nombre de la propiedad asociado al título del campo que recibe como parámetro.
Uso
Incluimos el plugin en nuestra página, detrás de leaflet.js:
Creamos la capa GeoCSV bien instanciando la clase o utilizando el alias L.geoCsv:
var mi_geocsv = L.geoCsv (csv_string, opciones);
Las opciones son las que hemos visto en el apartado anterior. El primer parámetro es un string con el contenido del fichero CSV. Si a la hora de instanciarlo no tenemos disponibles los datos, csv_string puede valer null y cargar los datos más adelante usando el método addData. Ejemplo de carga asíncrona usando jQuery:
//...
var mi_geocsv = L.geoCsv (null, {firstLineTitles: true, fieldSeparator: ','});
//...
$.ajax ({
type:'GET',
dataType:'text',
url:'datos.csv',
error: function() {
alert('No se pudieron cargar los datos');
},
success: function(csv) {
mi_geocsv.addData(csv);
mapa.addLayer(mi_geocsv);
}
});
Ejemplos
En el subdirectorio example se encuentran ejemplos completos del uso del plugin:
Test dinámico de las opciones de configuración
Cargando iconos personalizados desde el CSV
Pasando los datos a través de la URL
Mapa de las sucursales de Bankia: GeoCSV+MarkerCluster
About
Plugin para Leaflet que permite cargar un archivo CSV como capa geoJSON // Leaflet plugin for loading a CSV file as geoJSON layer.
Resources
Readme
Releases
1
Stable
Latest
Sep 9, 2020
Packages 0
No packages published
Used by 4
Contributors 5
Languages
JavaScript
92.9%
CSS
7.1%
© 2021 GitHub, Inc.
Terms
Privacy
Security
Status
Docs
Contact GitHub
Pricing
API
Training
Blog
About
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session.
You signed out in another tab or window. Reload to refresh your session.