{"id":24152282,"url":"https://github.com/nfreear/popup-geojson-map","last_synced_at":"2025-08-11T22:39:47.592Z","repository":{"id":12740031,"uuid":"72096405","full_name":"nfreear/popup-geojson-map","owner":"nfreear","description":"Add GeoJSON-based templated popups to your Leaflet maps -","archived":false,"fork":false,"pushed_at":"2023-01-07T23:26:53.000Z","size":1087,"stargazers_count":12,"open_issues_count":12,"forks_count":5,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-08-09T06:55:28.827Z","etag":null,"topics":["freesound","geojson","leaflet","lodash","mapbox","ndf-js","popup","template","underscore"],"latest_commit_sha":null,"homepage":"https://npmjs.com/package/geojson-popup","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nfreear.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-10-27T10:12:48.000Z","updated_at":"2024-08-09T04:33:24.000Z","dependencies_parsed_at":"2023-01-13T17:07:00.163Z","dependency_job_id":null,"html_url":"https://github.com/nfreear/popup-geojson-map","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/nfreear/popup-geojson-map","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nfreear%2Fpopup-geojson-map","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nfreear%2Fpopup-geojson-map/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nfreear%2Fpopup-geojson-map/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nfreear%2Fpopup-geojson-map/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nfreear","download_url":"https://codeload.github.com/nfreear/popup-geojson-map/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nfreear%2Fpopup-geojson-map/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269713612,"owners_count":24463232,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-10T02:00:08.965Z","response_time":71,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["freesound","geojson","leaflet","lodash","mapbox","ndf-js","popup","template","underscore"],"created_at":"2025-01-12T10:15:37.471Z","updated_at":"2025-08-11T22:39:47.563Z","avatar_url":"https://github.com/nfreear.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n[![Node.js CI][gci-icon]][gci]\n[![Build status — Travis-CI][travis-icon]][travis]\n[![geojson-popup on Npmjs][npm-icon]][npm]\n[![js-semistandard-style][semi-icon]][semi]\n[![License][license-icon]][mit]\n[![Total downloads - NPMJS.com][downl-icon]][npm]\n\n# nfreear / geojson-popup\n\nAdd GeoJSON-based templated popups to a [Leaflet][] map. See the audio-player example(s).\n\nEasily create interactive maps, with popups containing structured data, for example, audio players.\n\nRead the [introductory blog post][blog].\n\n## Changelog\n\n* [Release notes on GitHub][rel]\n\n## Build \u0026 test\n\n```sh\ngit clone https://github.com/nfreear/popup-geojson-map geojson-popup\ncd geojson-popup\nnpm install \u0026\u0026 npm run build \u0026\u0026 npm test\nnpm start\n```\n\n## Usage\n\nHTML containing a template, with placeholders, `title` and `audio_url`\n\n```html\n\u003cp id=\"mapid\"\u003e\u003c/p\u003e\n\n\u003cscript type=\"text/html\" id=\"popup-template\"\u003e\n  \u003cdiv class=\"audio-popup\"\u003e\n    \u003ch2\u003e\u003c%= title %\u003e\u003c/h2\u003e\n    \u003caudio src=\"\u003c%= audio_url %\u003e\" controls \u003e\u003c/audio\u003e\n  \u003c/div\u003e\n\u003c/script\u003e\n\n\u003cscript\u003e MAP_CFG = { geoJson: '{cdn}/data/world-audio-geo.json' } \u003c/script\u003e\n\n\u003cscript src=\"https://unpkg.com/geojson-popup@2.4.0#._.js\"\u003e\u003c/script\u003e\n```\n\nGeoJSON, with properties corresponding to the template placeholders, `title` and `audio_url`:\n\n```json\n\"features\": [\n  {\n    \"type\": \"Feature\",\n    \"properties\": {\n      \"title\": \"raining on the roof of Jennie Lee Building.wav\",\n      \"audio_url\": \"https://freesound.org/data/previews/92/92744_1315834-lq.mp3\"\n    },\n    \"geometry\": {\n      \"type\": \"Point\",\n      \"coordinates\": [ -0.7110, 52.0241 ]\n    }\n  }\n]\n```\n\n### `marker-symbol`\n\n[GeoJSON with `marker-symbol`][ev], and built in support for [Maki icons][maki]:\n\n```html\n\u003cscript\u003e\nMAP_CFG = {\n  geoJson: 'https://example.org/...charging-map.geo.json',\n  icon: 'maki' // 'default', 'maki' or 'div'.\n}\n\u003c/script\u003e\n```\n\n```json\n{\n  \"type\": \"FeatureCollection\",\n  \"features\": [\n    {\n      \"type\": \"Feature\",\n      \"properties\": {\n        \"marker-symbol\": \"fuel\",\n        \"marker-class\": \"custom\",\n        \"marker-html\": \"\u003cspan\u003eHTML\u003c/span\u003e\",\n        \"title\": \"Estates charging point (7 kW)\"\n      },\n      \"geometry\": {\n        \"type\": \"Point\",\n        \"coordinates\": [ -0.71138, 52.02565 ]\n      }\n    }\n  ]\n}\n```\n\n---\n\nSoftware \u0026 specs:\n* [GeoJSON][]\n* [Leaflet][]\n* [Lodash.template][_tpl] - _bundled_\n* [SuperAgent][] - _bundled_\n\nMap tiles:\n* [Leaflet providers][prov] — _default / free._\n* [Mapbox][]\n* [National Library of Scotland - Historic Maps][NLS]\n\nSources for example data \u0026 audio files:\n* [Freesound][]\n* [Commons][]\n\n## Rename\n\nI'm renaming the NPM package from [`popup-geojson-map`][npm-old] to the clearer [`geojson-popup`][npm].\n(I'll probably re-name the GitHub repo. too.) _Sorry for any hassle!_\n\n\n---\n\n* NPM:    [geojson-popup][npm]\n* GitHub: [nfreear/popup-geojson-map][]\n* Gist:   [nfreear/fd10..][gist]\n\n---\n\u0026copy; 2016-2021 Nick Freear, | License: [MIT][].\n\n\n[blog]: https://nick.freear.org.uk/2017/06/27/geojson-popup-leaflet.html?utm_source=npm\n[MIT]: https://nfreear.mit-license.org/2016-2021 \"MIT License | © 2016-2021 Nick Freear (date: 2016-09-26)\"\n[travis-icon]: https://travis-ci.org/nfreear/popup-geojson-map.svg\n[travis]: https://travis-ci.org/nfreear/popup-geojson-map \"Build status – Travis-CI\"\n[npm-old]: https://npmjs.com/package/popup-geojson-map\n[npm]: https://npmjs.com/package/geojson-popup\n[nfreear/popup-geojson-map]: https://github.com/nfreear/popup-geojson-map\n[rel]: https://github.com/nfreear/popup-geojson-map/releases\n[gist]: https://gist.github.com/nfreear/fd1005a2af7a8166862011b8fcb8a821 \"Gist: original JS (27-Sep-2016)\"\n[resume]: https://gist.github.com/nfreear/cceecc6e1cabdf8f8f4302aaed10923d \"Resume GeoJSON\"\n[ev]: https://gist.github.com/nfreear/d1cb9d672dd33511056fa472c9bde36f \"OU ev-charging GeoJSON\"\n\n[RFC]: https://tools.ietf.org/html/rfc7946 \"The GeoJSON Format, August 2016.\"\n[GeoJSON]: https://geojson.org/\n[Leaflet]: https://leafletjs.com/examples/geojson/ \"Using GeoJSON with Leaflet\"\n[SuperAgent]: https://visionmedia.github.io/superagent/\n[Superagent-X]: http://smalljs.org/ajax/superagent/\n[Lodash]: https://lodash.com/\n[_tpl]: https://npmjs.com/package/lodash.template\n[Underscore.js]: https://underscorejs.org/\n[Freesound]: https://freesound.org/search/?q=metro \"Freesound search: 'metro'\"\n[Commons]: https://commons.wikimedia.org/wiki/Category:Audio_files_of_music\n[prov]: https://leaflet-extras.github.io/leaflet-providers/preview/\n  \"'This page shows mini maps for all the layers available in Leaflet-providers.'\"\n[Mapbox]: https://www.mapbox.com/\n[NLS]: http://maps.nls.uk/projects/api/ \"National Library of Scotland - Historic Maps API.\"\n[maki]: https://www.mapbox.com/maki-icons/ \"Maki is an icon set made for map designers.\"\n\n[semi]: https://github.com/Flet/semistandard\n[semi-icon]: https://img.shields.io/badge/code_style-semistandard-brightgreen.svg\n  \"Javascript coding style — 'semistandard'\"\n[npm-icon]: https://img.shields.io/npm/v/geojson-popup.svg \"Latest version ~ on NPM\"\n[license-icon]: https://img.shields.io/npm/l/geojson-popup.svg\n[downl-icon]: https://img.shields.io/npm/dt/geojson-popup.svg \"Count of total downloads ~NPM\"\n[gci]: https://github.com/nfreear/popup-geojson-map/actions/workflows/node.js.yml\n[gci-icon]: https://github.com/nfreear/popup-geojson-map/actions/workflows/node.js.yml/badge.svg\n\n\u003c!-- Easily create interactive maps, with popups containing structured data, for example, audio players. --\u003e\n[End]: //.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnfreear%2Fpopup-geojson-map","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnfreear%2Fpopup-geojson-map","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnfreear%2Fpopup-geojson-map/lists"}