Everything you need to know about MapQube
Get started with MapQube in just a few minutes.
Sign up for a free account to get started with MapQube. Free tier includes 3 maps with 10,000 views/month.
Navigate to your dashboard and click "Create New Map". Use the editor to add markers, lines, polygons, and 3D objects.
Add markers with custom icons and colors, draw boundaries, upload 3D models, and style your map with titles and descriptions.
Click the "Publish" button to make your map publicly accessible and get your unique map ID.
Copy the iframe embed code from your dashboard or use the map URL: https://mapqube.com/map/YOUR_MAP_ID
Paste the iframe code into your HTML. Customize with query parameters for different looks and behaviors.
Your Map ID is required for embedding. Here's how to find it:
When viewing your published map, the URL format is:
https://mapqube.com/map/abc-123-def-456
The highlighted part is your Map ID
Click the "Get Embed Code" button in your dashboard to get a pre-filled iframe code with your Map ID included.
Learn how to embed your maps on any website with full customization options.
Copy and paste this code into your HTML to embed a map:
<iframe src="https://mapqube.com/map/YOUR_MAP_ID"
width="100%"
height="600"
frameborder="0"
allowfullscreen>
</iframe>
💡 Tip: Replace YOUR_MAP_ID with your actual map ID from your dashboard.
For maps that adapt to different screen sizes (16:9 aspect ratio):
<div style="position: relative; padding-bottom: 56.25%; height: 0;">
<iframe src="https://mapqube.com/map/YOUR_MAP_ID"
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
frameborder="0"
allowfullscreen>
</iframe>
</div>
Perfect for landing pages and hero sections:
<div style="width: 100%; height: 100vh;">
<iframe src="https://mapqube.com/map/YOUR_MAP_ID?header=true"
style="width: 100%; height: 100%;"
frameborder="0"
allowfullscreen>
</iframe>
</div>
Customize your embedded map by adding query parameters to the URL:
| Parameter | Type | Default | Description |
|---|---|---|---|
| header | boolean | false | Show map title and description header |
| tilt | number | 65 | Camera tilt angle (0-85 degrees) |
| fadeEdges | number | 10 | Edge fade amount in pixels (0 to disable) |
| transparentBackground | boolean | true | Enable transparent background |
| padding | number | 10 | Fit bounds padding in pixels |
| allowedMaps | string | all | Comma-separated map types: standard, satellite, outdoors, dark, light |
| showUserLocation | boolean | false | Display user's current location on map |
Perfect for subtle map placements with no 3D tilt
https://mapqube.com/map/YOUR_MAP_ID?tilt=0&fadeEdges=0
Shows user's location with map controls
https://mapqube.com/map/YOUR_MAP_ID?showUserLocation=true&header=true
Restricts to dark map style only
https://mapqube.com/map/YOUR_MAP_ID?allowedMaps=dark&tilt=45
Full header with custom padding and satellite view
https://mapqube.com/map/YOUR_MAP_ID?header=true&allowedMaps=satellite,standard&padding=50
All options combined
https://mapqube.com/map/YOUR_MAP_ID?header=true&tilt=45&fadeEdges=5&transparentBackground=false&padding=20&allowedMaps=standard,satellite&showUserLocation=true
Always wrap iframes in responsive containers for better mobile experience
Use minimum 400px height for optimal viewing experience
Our embeds are optimized (~800KB gzipped), loads in under 2 seconds on 3G
For security, always embed on HTTPS websites
Use header=true for standalone maps, omit for subtle integrations
MapQube embeds use a lightweight bundle (~800KB gzipped) separate from the main app. This means faster loading times and better user experience. Maps load in 600ms-1.5s on 3G connections.
Add unlimited markers with custom icons, colors, titles, and descriptions. Perfect for location-based content.
Choose from Standard, Satellite, Outdoors, Dark, and Light themes to match your brand.
Upload and place custom 3D objects (.glb/.gltf) on your maps for immersive experiences.
Track views and engagement for your embedded maps with real-time analytics.
Optimized embeds (~800KB) load in under 2 seconds on 3G connections.
Enterprise-grade security with Firebase backend and 99.9% uptime guarantee.
Maps automatically adapt to any screen size - desktop, tablet, or mobile.
Show visitor's current location on maps with the showUserLocation parameter.
Possible causes:
Solution: Your map has reached its monthly view limit. Upgrade your subscription plan to increase limits:
Tips to improve performance:
transparentBackground=trueallowedMapsCheck these items:
Requirements:
?showUserLocation=true to your map URLStill having issues? Contact our support team at support page or email us at support@mapqube.com
For detailed API documentation, programmatic access, and webhooks, please visit our API page.
See how businesses and developers are using MapQube:
Showcase properties with interactive 3D maps, nearby amenities, and custom markers.
?header=true&allowedMaps=satellite,standard&tilt=45
Help attendees find venues with user location and clear directions.
?showUserLocation=true&header=true&padding=50
Display multiple store locations with custom markers and detailed information.
?allowedMaps=standard&showUserLocation=true&tilt=0
Create interactive tour guides with points of interest and 3D landmarks.
?header=true&allowedMaps=outdoors,satellite&tilt=65
Show coverage areas with boundaries and service center locations.
?transparentBackground=false&fadeEdges=0&tilt=0
Designers and developers showcasing location-based work.
?allowedMaps=dark&header=true&fadeEdges=15
If you have any questions or need assistance, our support team is here to help.
Free Plan
48 hours
Pro Plan
24 hours
Enterprise Plan
4 hours