Store locator
on my website
Address autocomplete
in form / checkout
Route optimizer
multi-stop delivery
Delivery zone check
at checkout
Verify agent visit
proof of location
Google Maps bill
too high, want out
Mapsi API
what you actually need
Geocoding + map tile renderer. Geocode your store addresses once and save the coordinates — then render a MapLibre map with those markers on any page.
integration path
1
Create a free Mapsi account
Get your API key from mapsi.dev/dashboard/api-keys. Free tier: 1,000 geocoding calls/day.
2
Geocode your store addresses
GET /v1/geocode?q={address} — run this once per store and save lat/lon to your database. Don't call on every page load.
3
Add MapLibre + the Mapsi tile style to your page
Pass the Mapsi style URL directly to maplibregl.Map. Tiles, fonts, and sprites are all included — one URL, no extra config.
4
Add your store markers
Use map.addSource + addLayer with a GeoJSON FeatureCollection of your stored coordinates. Add popups with store name and hours.
integration guide
// 1. Geocode each store once — save to your DB
const res = await fetch(
'https://mapsi.dev/v1/geocode?q=12+MG+Road+Bengaluru&limit=1',
{ headers: { 'X-API-Key': 'YOUR_KEY' } }
);
const { results } = await res.json();
const { lat, lon } = results[0].coordinates;
// Save lat, lon to your DB here
// 2. Render map on your page
// <script src="https://unpkg.com/maplibre-gl/dist/maplibre-gl.js"></script>
// <div id="map" style="height:400px"></div>
const map = new maplibregl.Map({
container: 'map',
style: 'https://mapsi.dev/v1/tiles/styles?style=light&key=YOUR_KEY',
center: [77.59, 12.97],
zoom: 11
});
// 3. Add your store markers from DB
map.on('load', () => {
map.addSource('stores', {
type: 'geojson',
data: {
type: 'FeatureCollection',
features: stores.map(s => ({
type: 'Feature',
geometry: { type: 'Point', coordinates: [s.lon, s.lat] },
properties: { name: s.name }
}))
}
});
map.addLayer({ id: 'store-points', type: 'circle', source: 'stores',
paint: { 'circle-radius': 8, 'circle-color': '#378ADD' }
});
});
Watch out: Geocode once, cache forever. Store lat/lon in your DB when you add a store. Re-geocoding on every page load wastes your daily quota and adds 80–100ms latency to every request.
Typical: 1 geocoding call per store (one-time). Tile renders are unlimited on all plans. Free tier covers up to 1,000 geocode calls/day.