{"id":18542189,"url":"https://github.com/heremaps/here-interactive-map-layer-examples","last_synced_at":"2025-04-09T18:31:40.884Z","repository":{"id":71903500,"uuid":"438625430","full_name":"heremaps/here-interactive-map-layer-examples","owner":"heremaps","description":"Use case examples for interactive map layers including geometry simplification, data sampling, clustering, and spatial/property search.","archived":false,"fork":false,"pushed_at":"2022-12-21T18:20:23.000Z","size":3827,"stargazers_count":10,"open_issues_count":0,"forks_count":3,"subscribers_count":6,"default_branch":"main","last_synced_at":"2025-03-24T10:21:20.512Z","etag":null,"topics":["examples","geospatial","here-platform","interactive-map-layer","maps"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/heremaps.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2021-12-15T12:42:24.000Z","updated_at":"2024-10-23T06:51:59.000Z","dependencies_parsed_at":null,"dependency_job_id":"7006f010-3ccd-4475-a47e-18a5baa053f1","html_url":"https://github.com/heremaps/here-interactive-map-layer-examples","commit_stats":{"total_commits":15,"total_committers":4,"mean_commits":3.75,"dds":0.5333333333333333,"last_synced_commit":"5c557c833cdbef3071cce6805ca3a5091491add8"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/heremaps%2Fhere-interactive-map-layer-examples","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/heremaps%2Fhere-interactive-map-layer-examples/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/heremaps%2Fhere-interactive-map-layer-examples/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/heremaps%2Fhere-interactive-map-layer-examples/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/heremaps","download_url":"https://codeload.github.com/heremaps/here-interactive-map-layer-examples/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248087777,"owners_count":21045589,"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":["examples","geospatial","here-platform","interactive-map-layer","maps"],"created_at":"2024-11-06T20:07:40.988Z","updated_at":"2025-04-09T18:31:35.875Z","avatar_url":"https://github.com/heremaps.png","language":"JavaScript","readme":"# HERE Interactive Map Layer Examples\n\nThis repository contains examples for interactive map layers - one of the [supported data layer types](https://developer.here.com/documentation/data-user-guide/user_guide/portal/layers/layers.html) on [HERE platform](https://www.here.com/platform). Interactive map layers offer a set of unique capabilities, enabling you to store, retrieve, search for, analyze and modify data at a feature (e.g., a place) and feature property (e.g., the name of the place) level.\n\nThe API behind interactive map layers is the [Interactive API](https://developer.here.com/documentation/data-api/api-reference-interactive.html).\n\n\n![Clustering with interactive map layers](examples/sampling/opengraph.png)\n\n## Examples\n\n###  Geometry Simplification\n\n__[Source Code](examples/simplification) - [Live Map](https://heremaps.github.io/here-interactive-map-layer-examples/examples/simplification/index.html)__\n\nMap features stored in interactive map layers can be retrieved as tiles. Interactive map layers offer the ability to simplify the geometry of the features in the tiles. This can be useful for reducing the amount of data that needs to be transferred to the client and helps the client to render the data faster.\n\nIn this example two very long routes were created using [HERE Routing API](https://developer.here.com/documentation/routing-api/dev_guide/index.html). The tiles returned by Interactive API, contain a simplified version of the route geometry optimized for the zoom level of the map. \n\n### Data Sampling\n\n__[Source Code](examples/sampling) - [Live Map](https://heremaps.github.io/here-interactive-map-layer-examples/examples/sampling/index.html)__\n\nOne of the features offered by interactive map layers is data sampling. Data sampling enables clients to efficiently render an excerpt of a very large data set for visual reference and analysis, without the need to retrieve all the data.\n\nThis example includes a cadastral map to explore the trees in maintenance of the city of Amsterdam, stored as individual map features. On map zoom levels, where there are too many features, the tiles returned by Interactive API include only a sample with a geographically accurate representation of the data.\n \n### Clustering\n\n__[Source Code](examples/clustering) - [Live Map](https://heremaps.github.io/here-interactive-map-layer-examples/examples/clustering/index.html)__\n\nInteractive map layers offer the capability to retrieve statistical information for the data stored in the layer. Both hexagonal and square grid clustering are supported.\n\nThe example shows how interactive map layers are used to demonstrate the density of supermarket coverage in the UK. The supermarket retail points are stored in an interactive map layer. The layer is then queried to retrieve the individual points, the density of all supermarkets, and the density of each supermarket chain.\n\n### Spatial and Property Search \n\nFeatures stored in interactive map layers can be retrieved by spatial and/or property search queries. The spatial search query can be used to retrieve features that intersect a given point, line or area. This is provided to the API as a GeoJSON geometry. Additionally, a radius parameter defined in meters could be specified.\n\nThe property search query can be used to retrieve features that have a property value that matches a given value. It is possible to search for numeric ranges, to query multiple property values, and to combine the queries using logical operators. Property search can be combined with requests for tile, bounding box and spatial search.\n\n#### Example 1\n\n__[Source Code](examples/spatial-and-property-search-1) - [Live Map](https://heremaps.github.io/here-interactive-map-layer-examples/examples/spatial-and-property-search-1/index.html)__\n\nThis example includes a map to explore sport facilities in the city of Amsterdam. Property search is used to filter the features by the type of sport. The locations of the facilities are then used as an input for the spatial search query to find the administrative areas that contain the facilities of that type. \n\n#### Example 2\n\n__[Source Code](examples/spatial-and-property-search-2) - [Live Map](https://heremaps.github.io/here-interactive-map-layer-examples/examples/spatial-and-property-search-2/index.html)__\n\nThis example includes a map to explore sport facilities, public transport lines and stations in the city of Amsterdam. Property search is used to filter the features by the sport type. It is combined with spatial search to find the facilities of that type located near a selected public transport station or all of the stations for a selected transport line.\n\n## Prerequisites\n\n* [Node.js](https://nodejs.org) (8.16.0+)\n* [Yarn](https://yarnpkg.com/en/docs/install) (1.11.0+)\n\n\n## Getting Started\n\n### Clone this repository\n    \n    git clone https://github.com/heremaps/here-interactive-map-layer-examples.git\n\n    cd here-interactive-map-layer-examples\n    \n### Setup HERE public repository\nIn order to be able to use the [HERE Maps API for Javascript](https://developer.here.com/develop/javascript-api) with NPM the HERE public repository must be added to the NPM configuration:\n    \n    yarn config set @here:registry https://repo.platform.here.com/artifactory/api/npm/maps-api-for-javascript/\n    \n### Install dependencies\n    \n    yarn install\n\n### Set your API key\n\nSet your [HERE platform API Key](https://developer.here.com/documentation/identity-access-management/dev_guide/topics/plat-using-apikeys.html).\n\n    yarn set-api-key \u003cYOUR_API_KEY\u003e\n\n### Build and launch the examples\n\nTo only build the examples, run:\n        \n    yarn build\n\nOr alternatively, to build the examples, serve them locally and open them in the browser use the following command:\n\n    yarn start\n\n# Acknowledgements\n\nSome of the map clients and libraries in the examples include:\n\n* [XYZ Maps](https://github.com/heremaps/xyz-maps)\n* [Open Layers](https://openlayers.org/)\n* [Tangram](https://github.com/tangrams/tangram)\n* [HERE Maps API for Javascript](https://developer.here.com/develop/javascript-api)\n\n# License\n\nCopyright (C) 2021-2022 HERE Europe B.V.\n\nThis project is licensed under the Apache License, Version 2.0 - see the [LICENSE](LICENSE) file for details","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fheremaps%2Fhere-interactive-map-layer-examples","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fheremaps%2Fhere-interactive-map-layer-examples","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fheremaps%2Fhere-interactive-map-layer-examples/lists"}