Mapmetrics Logo

# Mapmetrics GL JS The Maps API allows you to retrieve vector tiles generated by the MapMetrics. You can use some libraries like Leaflet or MapMetrics GL for JavaScript, Android or iOS to add a map to your website. ## Getting Started ### Using CDN Include the JavaScript and CSS files in the `` of your HTML file. ```html ``` Include the following code in the `` of your HTML file. ```html
``` ### Using NPM Library Install npm library ```html npm i @mapmetrics/mapmetrics-gl ``` ```html import React, { useEffect, useRef } from "react"; import mapmetricsgl from "@mapmetrics/mapmetrics-gl"; import "@mapmetrics/mapmetrics-gl/dist/mapmetrics-gl.css"; const App = () => { const mapContainerRef = useRef(null); const mapRef = useRef(null); const accessToken = ``; useEffect(() => { if (!mapContainerRef.current || mapRef.current) return; const map = new mapmetricsgl.Map({ container: mapContainerRef.current, style: `${accessToken}`, center: [2.349902, 48.852966], zoom: 11, minZoom: 1, maxZoom: 24, attributionControl: false, cooperativeGestures: true, }); mapRef.current = map; return () => { map.remove(); mapRef.current = null; }; }, []); return (
); }; export default App; ``` Enjoy the map!
## Documentation Full documentation for this library [is available here](https://docs.mapmetrics.org/). Check out the features through [examples](https://docs.mapatlas.xyz/overview/sdk/examples/simple-map-cdn.html)