Point-map
An elegant global view map.
Usage
1. Install
You can use this library through NPM
, Javascript <Script>
tag from CDN.
1.1 NPM
Use NPM install package
npm install point-map
import it in your .js file
1.2 Script
Hello World
Point-map demo
Interfaces
PointMap(elementID)
Create an point map instances by given a DOM's id.
Example:
'map';
PointMap.addEvent(EventObject)
Add a event on the map.
EventObject.name
[String] The name of the Event, Could be anything.
EventObject.coordinate
[Array] The Latitude and longitude of the Event [Latitude, Longitude]
EventObject[others]
[Any] Other Customer propertis of the event;
Example:
map
PointMap.addEvents([EventPoints])
Add many events on the map, This is a short cut of the PointMap.addEvent.
Example:
map
PointMap.on(EventName, CallbackFunction)
Add an event on the map.
EventName
[String] the event name could be mousemove
,click
CallbackFunction(event, Pointinfo)
When the event trigger, the 1st param is the DOM event, The 2nd param is object of the customer Point info.
Examples:
let map = new PointMap('map');
// Add event points
map.addEvents({
name: '上海',
coordinate: [121.47, 31.233]
});
map.on('mousemove', function(e, data) {
if (data) {
console.log('you are move into a customer Event', data)
} else {
console.log('you are not on a custome')
}
});
PointMap.remove(EventName, EventFunction)
Remove an event on the map.
EventName
[String] the event name
EventFunction
The function Which we add to the map
Examples:
let map = new PointMap('map');
// Add event points
map.addEvents({
name: '上海',
coordinate: [121.47, 31.233]
});
const fn = (e,data)=>{console.log('you are moving')};
map.on('mousemove', fn);
map.remove('mousemove', fn);