{"id":16316522,"url":"https://github.com/willviles/ember-leaflet-heatmap","last_synced_at":"2025-03-22T21:31:33.772Z","repository":{"id":8806724,"uuid":"59829482","full_name":"willviles/ember-leaflet-heatmap","owner":"willviles","description":"Ember Leaflet Addon to add Heatmap.js support.","archived":false,"fork":false,"pushed_at":"2023-02-02T04:59:12.000Z","size":1932,"stargazers_count":4,"open_issues_count":8,"forks_count":5,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-18T14:53:42.309Z","etag":null,"topics":["ember","ember-addon","ember-leaflet-heatmap","heatmap","leaflet","map-visualization","visualization"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/willviles.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-05-27T11:23:24.000Z","updated_at":"2023-03-10T09:27:07.000Z","dependencies_parsed_at":"2023-02-17T14:30:25.347Z","dependency_job_id":null,"html_url":"https://github.com/willviles/ember-leaflet-heatmap","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/willviles%2Fember-leaflet-heatmap","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/willviles%2Fember-leaflet-heatmap/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/willviles%2Fember-leaflet-heatmap/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/willviles%2Fember-leaflet-heatmap/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/willviles","download_url":"https://codeload.github.com/willviles/ember-leaflet-heatmap/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245022529,"owners_count":20548550,"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","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":["ember","ember-addon","ember-leaflet-heatmap","heatmap","leaflet","map-visualization","visualization"],"created_at":"2024-10-10T22:04:53.349Z","updated_at":"2025-03-22T21:31:33.402Z","avatar_url":"https://github.com/willviles.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Ember Leaflet Heatmap\n======\n\n[![Build Status](https://travis-ci.org/willviles/ember-leaflet-heatmap.svg)](https://travis-ci.org/willviles/ember-leaflet-heatmap) [![Ember Observer Score](http://emberobserver.com/badges/ember-leaflet-heatmap.svg)](http://emberobserver.com/addons/ember-leaflet-heatmap) ![Download count all time](https://img.shields.io/npm/dt/ember-leaflet-heatmap.svg) [![npm](https://img.shields.io/npm/v/ember-leaflet-heatmap.svg)](https://www.npmjs.com/package/ember-leaflet-heatmap)\n\nOffers [Heatmap.js](https://www.patrick-wied.at/static/heatmapjs/) functionality for [Ember-Leaflet](http://ember-leaflet.com), an Ember Addon for [Leaflet](http://leafletjs.com) interactive maps.\n\n## Installation\n\n`ember install ember-leaflet-heatmap`\n\n## Usage\n\n### Setup\n\nTo setup the heatmap, simply add the `heatmap-layer` component and pass in an Ember Array of data. By default, Ember Leaflet Heatmap will grab `lat`, `lng` and `value` properties from each item in your array. It will listen to all array changes and automatically update the heatmap.\n\n```handlebars\n{{#leaflet-map lat=lat lng=lng zoom=zoom}}\n\n  {{tile-layer url=\"http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png\"}}\n\n  {{heatmap-layer data=data options=options}}\n\n{{/leaflet-map}}\n```\n\nIf your data doesn't have `lat`, `lng` or `value` keys, you can set the correct property key references like so:\n\n```handlebars\n{{heatmap-layer data=data latField=\"latitude\" lngField=\"longitude\" valueField=\"risk\"}}\n```\n\n### Options\n\nAll [Heatmap.js options](https://www.patrick-wied.at/static/heatmapjs/docs.html#h337-create) can be passed into the component, either as individual values or in an options hash. Some examples are below:\n\n```handlebars\n{{heatmap-layer data=data\n                backgroundColor=\"#FFFFFF\"\n                maxOpacity=0.5\n                blur=0.85}}\n```\n\n### Contextual Component support\n\n[Ember-Leaflet](http://ember-leaflet.com) now makes use of contextual components in Ember. However, only the built in child components are defined out-of-the-box:\n\n```handlebars\n{{#leaflet-map lat=lat lng=lng zoom=zoom as |layers|}}\n  \u003c!-- layers.heat-map undefined --\u003e\n{{/leaflet-map}}\n```\n\nTo use Ember Leaflet Heatmap as a contextual component, extend the base leaflet-map component into a custom component of your own.\n\n```javascript\n// your-map.js\nimport LeafletMap from 'ember-leaflet/components/leaflet-map';\n\nexport default LeafletMap.extend({\n  // Add options here\n});\n```\n\nNext, override the template with the components you need. For a full list of built-in components, [click here](https://github.com/miguelcobain/ember-leaflet/blob/master/addon/templates/current/leaflet-map.hbs).\n\n```handlebars\n{{yield (hash\n  heatmap=(component \"heatmap-layer\" parentComponent=this)\n)}}\n```\n\nThen, you can use it in your templates like so:\n\n```handlebars\n{{#your-map lat=lat lng=lng zoom=zoom as |layers|}}\n\n  {{layers.heatmap data=data options=options}}\n\n{{/your-map}}\n```\n\n## Running\n\n* `ember server`\n* Visit your app at http://localhost:4200.\n\n## Running Tests\n\n* `yarn test` (Runs `ember try:testall` to test your addon against multiple Ember versions)\n* `ember test`\n* `ember test --server`\n\n## Building\n\n* `ember build`\n\nFor more information on using ember-cli, visit [http://ember-cli.com/](http://ember-cli.com/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwillviles%2Fember-leaflet-heatmap","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwillviles%2Fember-leaflet-heatmap","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwillviles%2Fember-leaflet-heatmap/lists"}