Explore our entire suite of APIs & SDKs
SDKs for maps and traffic
APIs for search and discovery
APIs to solve complex routing problems
Connected embedded navigation
SDK to enable live location in your apps
Maps, search, routes for 238 nations
Hyperlocal, personalised O2O marketing
Route planning & optimisation
GeoBI meets Location AI
Field force automation APIs
Embed maps, navigation in your apps
Hybrid navgation for embedded systems
Intelligent mobility platform for PV, CV, EV
Offline navigation maps and app
Super app for maps, safety, and more
Connected embedded navigation
Connected embedded navigation
Convert movement data to traffic analytics
SDKs for maps and traffic
Hyperlocal, personalised O2O marketing
APIs for search and discovery
APIs to solve complex routing problems
Connected embedded navigation
Route planning & optimisation
APIs for 360° panoramic images
SDKs for maps and traffic
Hyperlocal, personalised O2O marketing
APIs for search and discovery
APIs to solve complex routing problems
Connected embedded navigation
Route planning & optimisation
APIs for 360° panoramic images
Bring and search with your data
SDKs for maps and traffic
Hyperlocal, personalised O2O marketing
APIs for search and discovery
APIs to solve complex routing problems
Connected embedded navigation
Route planning & optimisation
APIs for 360° panoramic images
Bring and search with your data
SDKs for maps and traffic
Hyperlocal, personalised O2O marketing
APIs for search and discovery
APIs to solve complex routing problems
Connected embedded navigation
Route planning & optimisation
APIs for 360° panoramic images
Bring and search with your data
Marker with Popup
/* First install : npm install mappls-web-maps */
import { Component, OnInit, ElementRef } from '@angular/core';
import { mappls } from 'mappls-web-maps';
@Component({
selector: 'app-root',
template: '',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
mapObject: any;
mapplsClassObject = new mappls();
title = 'Marker with Popup';
mapProps = {
center: [28.61, 77.23],
zoomControl: true,
location: true
}
ngOnInit() {
this.mapplsClassObject.map({ id: "map", key: "", properties: this.mapProps }, (data: any) => {
this.mapObject = data;
new mappls().Marker({
map: this.mapObject,
position: { "lat": 28.519467, "lng": 77.223150 },
fitbounds: true,
popupHtml: 'MapmyIndia'
});
});
}
}
/* First install : npm install mappls-web-maps */
import { mappls } from 'mappls-web-maps';
import './App.css';
function App() {
const styleMap = {width: '99%', height: '99vh', display:'inline-block'}
var mapObject ;
var mapplsClassObject= new mappls();
const title = "Marker with Popup"
const mapProps = { center: [28.61, 77.23]}
mapplsClassObject.map({ id: "map", key: "", properties: mapProps }, (data) => {
mapObject = data;
mapObject.addListener('load', () => {
mapplsClassObject.Marker({
map: mapObject,
position: {"lat": 28.519467,"lng": 77.223150 },
fitbounds: true,
popupHtml: 'MapmyIndia'
});
});
});
return (
);
}
export default App;
Personalisation SDK, by Mappls, is India's first O2O engagement tool that can 3X your customer engagement, retention and conversion.
There's so much that Mappls MapmyIndia can do for your enterprise or individual requirements. Explore our website to learn more or request a callback/email if you'd like us to connect with you.