Baidu map lbs Cloud Data Custom Ma point

apply for SKFirst, go here and register your account.
http://developer.baidu.com/map/Create Application
Login after registering, go to API console
Create an application
Using cloud data requires creating a "server-side" application
Check mode Select the default "IP Whitelist Test", if you do not want to make any restrictions directly fill in the input box 0.0.0.0/0
After submitting the creation completes, may obtain the SK. When referencing the API, it is brought in by ak= Create the cloud data of the hemp dotSelect "Data Management" with the same interface as the creation application
Create the data table and fill in the table name. Success will be a string of numbers (the position of the red line covered in the figure, this is the effect after the completion of the table, MapData is the table name), this string of numbers is Geotableid, in the code will be used.
Create a hemp Dot
Support Online creation
Can also be created through a CSV template, and can also be stored by post
Baidu API Details link

Http://api.map.baidu.com/geodata/v3/poi/upload     //  POST request

ApplicationIntroducing APIs into the page

< script type= "Text/javascript" src= "http://api.map.baidu.com/api?v=2.0&ak= A4749739227af1618f7b0d1b588c0e85 ">

Sample code

var map = new Bmap.map ("L-map");          

var point = new Bmap.point (116.403694,39.927552);  

Map.centerandzoom (Point, 15);                 



    

    

    

    





Customlayer.addeventlistener (' Hotspotclick ', callback);

Detailed example reference Baidu sample Hemp Point Style

At present the official offers a custom method that only provides a selectable style, and the general need to use these styles is sufficient.
But strangely enough, the test found that the style was not perfect.

After MouseOver

Obviously, the mouseover style shows a problem.

Effect after level amplification

The icon shown in the figure, Class A is low, and Class B is displayed at high levels (when mouseover) is used in the Ionic project

API Introduction and Web page is no different, but because it involves cross-domain, so may need to add white list whitelist
1. Install Whitelist Plugin

Ionic  Plugin Add cordova-plugin-whitelist

2. Add in Config.xml (Demo stage without any restrictions)

< allow-navigation href= "data:*"/>

Note:Because the Content-security-policy property of the META tag is not set, whitelist throws the error "no content-security-policy meta tag found." Please add one when using the Cordova-plugin-whitelist plugin. " I chose to ignore it and continue to use it, and it doesn't seem to have any effect.

Synchronizing Data References

Http://www.tuicool.com/articles/jQzUny2