# heremaps_examples **Repository Path**: mirrors-gis/heremaps_examples ## Basic Information - **Project Name**: heremaps_examples - **Description**: No description available - **Primary Language**: Unknown - **License**: MIT - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-10-21 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # HERE Maps Community on GitHub Examples, Demos and Custom Map Components written by the HERE Maps Coding Community > **NOTE** These examples are for the **deprecated 2.5.4** JavaScript API. Newer 3.x examples can be downloaded [here](https://github.com/heremaps/maps-api-for-javascript-examples) and also viewed on [jsFiddle](https://github.com/heremaps/jsfiddle-github/blob/master/README.md). **Simple Examples**: A series of graduated code [examples](https://github.com/heremaps/examples/#simple-examples) using the [Maps API for JavaScript](http://developer.here.com/javascript-apis/), each example displays a short snippet of code with the correct syntax to do a specified task - for example _"How do I add a `Polygon` to the map?"_ Useful when getting started, or as an aide-memoire when writing something new. **Advanced Examples**: A second set of [examples](https://github.com/heremaps/examples/#advanced-examples), demonstrating the use of the **advanced** features of the [Maps API for JavaScript](http://developer.here.com/javascript-apis/). These examples cover more difficult concepts such as [asynchronous loading](https://github.com/heremaps/examples/#asynchronous-loading),[KML](https://github.com/heremaps/examples/#kml) and [Map overlays](https://github.com/heremaps/examples/#overlays). **Demos and Custom Components**: [Demos](https://github.com/heremaps/examples/#demos-and-custom-components) showcase the power of the [Maps API for JavaScript](http://developer.here.com/javascript-apis/) when mashed up with other APIs or data sources. Custom Components extend the basic functionality of the API to introduce new components which offer additional capabilities (such as `GeoJSON` parsing). The files necessary for each demo can be found in a separate directory. Each custom component also offers a demonstation of usage where the component itself can be found within a separate `libs` directory. Obviously demos and custom components cover a very broad range of subjects, so they have been split thematically below: See the [LICENSE](LICENSE) file in the root of this project for license details. ## Demos and Custom Components ### Custom Components * [Map Restriction](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/restrict-map-component/index.html) - Restricts the map to a certain region or zoom level * [Interactive Control](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/marker-interactivity-component/index.html) - Simple method to add "onclick" and forwarding to map markers * [Magnifier](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/magnifying-glass/index.html) - Demonstration of map observers showing a high zoom map over the base map. * [Text on Icon](https://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/text-on-icon-marker/index.html) - adding text to a custom marker * [Tooltips](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/tooltip-component/index.html) - custom control to add tooltips to markers * [x-Ray](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/x-ray-component/index.html) - demonstration of map observers showing a satellite map over the base map ### Directions Rendering * [Routing with Directions](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/directions-rendering-component/a-to-b-with-directions.html) - demonstrates the use of a custom directions renderer component to display manuever instructions on the page * [Suggestion Based Routing](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/directions-rendering-component/suggestion-box-with-directions.html) - complete routing example where the start and end points are based on user suggestions * [Context Menu Based Routing](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/directions-rendering-component/context-menu-with-directions.html) - routing example using a context menu * [Routing to a known destination](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/directions-rendering-component/geocode-with-directions.html) - routing example to a fixed end point. The user enters a starting address * [Query String Routing](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/directions-rendering-component/query-string.html) - complete routing example where the start and end points are encoded in the query string. ### Geocoding Demos * [Concurrent Search](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/multiple-search-requests/index.html) - Making concurrent requests. * [Find a US State](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/find-an-american-state/index.html) - A simple game based on Geocoding. ### Heat Map Mashups * [Flickr](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/flickr-heat-map/index.html) - heatmap of locations people have taken photos and uploaded to Flickr * [Instagram](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/instagram-heat-map/index.html) - heatmap of locations people have taken photos and uploaded to Instagram ### KML + GeoJSON Demos **KML Generation Tools** * [KML Generator from Data](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/generate-kml/generate-kml-file-from-data.html) - Geocoding of files to KML Format. * [KML Generator from Map](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/generate-kml/generate-kml-file-from-map.html) - Point and Click KML Generator * [Premier League Football Teams](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/generate-kml/premier-league-football-teams.html) - Map Objects to KML **GeoJSON Parsing Examples** * [GeoJSON: Hurricane Season](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/geojson-parser/load-geojson-hurricane-data-using-ajax.html) - Displays GeoJSON data from the 2004 Hurricane Season * [GeoJSON: Premier League Teams](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/geojson-parser/load-geojson-premiership-data-using-ajax.html) - Displays the location of Football Stadiums in the English Premier League * [GeoJSON: Russian Provinces](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/geojson-parser/load-geojson-russia-data-using-ajax.html) - Displays the Name and location of the provinces of Russia * [GeoJSON: Parser Demo](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/geojson-parser/parse-geojson-data.html) - Parsing Demo of various standard GeoJSON elements. **KML Parsing Examples** * [KML: Chinese Cities](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/generate-kml/cities-in-china.html) - Displays KML data about the largest cities in China * [KML :Finnish Cities](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/generate-kml/load-kml-cities-in-finland.html) - Displays KML data about the largest cities in Finland * [KML: Estate Agents](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/generate-kml/load-kml-estate-agents.html) - Displays a KML data file created from a Right Move Estate Agents data file * [KML: Premier League Football Teams](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/generate-kml/premier-league-football-teams.html) - Displays a KML data file holding the location of Football Stadiums in the English Premier League **AJAX Loading** * [XML: Marker Data](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/load-marker-data-using-ajax/index.html) - Loads marker using an AJAX call. ### Map Overlay Demos * [Aerial HERE Maps Styles](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/map-tiles/aerial-map-tile-styles-and-modes.html) - A demonstration of available aerial HERE Maps map types (terrain, satellite etc.) and available languages. * [Base HERE Maps Styles](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/map-tiles/base-map-styles-and-modes.html) - A demonstration of available HERE Maps base map types and available languages. * [Map with POIs](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/map-tiles/base-map-with-pois.html) - A HERE Map displaying points of interest icons. * [Bilingual Map](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/map-tiles/bilingual-map.html) - A HERE Map in Chinese and English * [Community Maps](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/demos/map-tiles/community-map.html) - A demonstration displaying the HERE Maps community map layer using a quad key algorithm. * [Grid Overlay](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/svg-grid-overlay/index.html) - A demonstration of **TMS** (Tile Map Server) syntax using a tile overlay from the National Library of Scotland. ### Sidebar Component * [German Election Results](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/sidebar-component/bar-chart-election-result.html) - election results in a side bar * [German City Populations](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/sidebar-component/bar-chart-markers.html) - city populations in a side bar * [Premier League Football](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/sidebar-component/map-sidebar-control.html) - football teams in a side bar * [Side Bar within Map](http://github.com/heremaps/examples/blob/master/maps_api_for_javascript/demos/sidebar-component/map-sidebar-within-map.html) - a side bar within the map itself ## Simple Examples Basic code snippets to get you started: * [Add a Circle to the Map](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/circle.html) * [Add a Polygon to the Map](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/polygon.html) * [Add a Rectangle to the Map](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/rectangle.html) * [Add a Marker to the Map](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/simple-marker.html) * [Change Marker on Zoom](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/change-marker-on-zoom.html) * [Display Place Data](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/display-place-data.html) * [Find Nearest Marker](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/find-nearest-marker.html) * [Find User Address](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/find-user-address.html) * [Find User Position](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/find-user-position.html) * [Geocoding](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/geocoding.html) * [Geocoordinate on Click](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/geocoordinate-on-click.html) * [Highlight a Marker](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/highlighting-a-marker.html) * [Infobubble on Click](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/infobubble-on-marker-click.html) * [Infobubble](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/infobubble.html) * [Map Components](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/map-components.html) * [Open Infobubble with Id](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/opening-infobubble-with-id.html) * [Pan the Map](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/panning-the-map.html) * [Pixel to Geocoordinate](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/pixel-to-geocoordinate.html) * [Set Center and Zoom Level](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/map-set-center-and-zoom-level.html) * [Simple Routing](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/routing-from-a-to-b.html) * [Zoom to All Markers](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/simple-examples/zoom-to-all-markers.html) ## Advanced Examples The advanced examples are split thematically as shown: ### Advanced Map Objects * [Custom Graphics Marker](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/custom-graphics-marker.html) * [Sprite Markers](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/sprite-markers.html) ### Asynchronous Loading * [Asynchronous Loading](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/asynchronous-loading.html) * [Combining with Static Maps](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/combining-with-here-static-maps.html) ### Clustering * [Clustering with a Theme](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/700-markers-clustering-with-theme.html) * [Clustering with Zoom](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/700-markers-clustering-with-zoom.html) * [Simple Clustering](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/700-markers-simple-clustering.html) * [Unclustered Markers](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/700-markers-unclustered.html) ### KML * [Simple KML Loader](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/load-kml-file.html) * [Cross-domain KML Loader](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/load-kml-file-cross-domain.html) ### Overlays * [Ground Overlay](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/ground-overlay.html) * [Tile Overlay](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/tile-overlay.html) ### Other * [Context Menu](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/context-menu.html) * [Coroutine](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/coroutine.html) * [IDL Check](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/international-date-line-check.html) * [Map Language](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/map-language.html) * [OLists](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/olist.html) * [Map Features](http://github.com/heremaps/examples/tree/master/maps_api_for_javascript/advanced-examples/reading-map-features.html)