Geoapify's public fiddles
-
Data Layer: Simple
Sample code for Google Maps Platform JavaScript API author(s): Justin Poehnelt
-
Using IP Geolocation and HTML Geolocation with MapLibre GL
This code allows you to obtain a user's city-level location through IP geolocation with the Geoapify IP Geolocation API, and displays it on a Maplibre GL map.
-
o1rkLwtx
No-Library (pure JS), HTML, CSS, JavaScript
-
Draw isolines with MapLibreGL
This code sample shows how to calculate an isoline and draw it with MapLibreGL
-
Geocoding Service
No-Library (pure JS), HTML, CSS, JavaScript
-
Collect customer's payment address on website and verify it
This code sample shows how to create address collection forms. You can verify the entered address with the Geocoding API.
-
Form to collect shipping and payment addresses
Here's a sample code that shows how to create an address collection form to get postcode, city, street, house number from a customer.
-
Shipping / Payment Address and Location Information
Here is a code sample that shows how to collect address information and its location. This code sample uses @geoapify/geocoder-autocomplete and Reverse Geocoding API
-
[Internal] Exporting places
This code sample shows how to get places of a chosen category for a city using Geoapify Location services
-
Search OSM Places for cities using the Geoapify Places API.
This code sample shows how to get places of a chosen category for a city using Geoapify Location services
-
124Loe7u
No-Library (pure JS), HTML, CSS, JavaScript
-
How to add a Leaflet map with address autocomplete field
The code sample show how to add a map with address search to a website, including CMS websites like Wordpress
-
Places API results on a MapLibre GL map
Get places with API and show them on a MapLibre GL map as a GeoJSON layer
-
Routing API + MapLibre GL
Build a route and display results on MapLibre GL map
-
Leaflet: draw GeoJSON polygon
Get an isochrone and draw it with Leaflet
-
Display a map
Initialize a map in an HTML element with MapLibre GL JS. See the example: https://docs.mapbox.com//maplibre-gl-js-docs/example/simple-map/
-
Route Elevation Profile with Chart.js
This code sample shows you how to calculate a route with the Geoapify Routing API and visualize the elevation profile of that route with Chart.js.
-
Routing API + MapLibre GL
Build a route and display results on MapLibre GL map
-
Routing API + Leaflet
Display a route on a Leaflet map
-
epb6w3z8
No-Library (pure JS), HTML, CSS, JavaScript