Use Baidu Map to draw a map, and draw a line on the map to form a personal trajectory, add description and name, the code is as follows:
Baidu maps API function Map
= new Bmap.map ("Allmap"); Create a Map instance
map.centerandzoom (new Bmap.point (116.404, 39.915), one); Initialize map, set center point coordinates and map level
map.setcurrentcity ("Beijing"); Set up a map to show the city this item is
Map.enablescrollwheelzoom (true) that must be set; Turn On mouse wheel zoom
Create a Baidu map example,
Add Map control
var top_left_control = new Bmap.scalecontrol ({anchor:bmap_anchor_top_left});//upper left corner, add scale
var top_ Left_navigation = new Bmap.navigationcontrol (); Upper left, add default zoom translation control
var top_right_navigation = new Bmap.navigationcontrol ({anchor:bmap_anchor_bottom_right, type: Bmap_navigation_control_small}); The upper-right corner contains only the pan and zoom button
Map.addcontrol (Top_left_control);
Map.addcontrol (top_left_navigation);
Map.addcontrol (top_right_navigation);
Add space on the map
var styleoptions = {
Strokecolor: "#4B0082", //Edge color.
FillColor: "Red", //Fill color. When the argument is empty, the circle will not have a fill effect.
Strokeweight:3, //edge width, in pixels.
strokeopacity:0.8, //edge transparency, value range 0-1.
fillopacity:0.6, //Fill transparency, value range 0-1.
Strokestyle: ' Solid '//sideline style, solid or dashed.
}
Instantiate mouse Draw tool
var drawingmanager = new Bmaplib.drawingmanager (map, {
isopen:false,//Open drawing mode
Enabledrawingtool:true,//whether to display the toolbar
drawingtooloptions: {
anchor:bmap_anchor_top_right,//position
offset: New Bmap.size (5, 5),//deviating value
drawingmodes: [
bmap_drawing_polyline
]
},
polylineoptions: Styleoptions,//Line style
});
After you draw the polyline, save it as a file, and read the code dynamically each time:
var polylinepointsarray = [];
for (var i = 0;i<result.length;i++) {
Polylinepointsarray.push (new Bmap.point (Result[i].lng,result[i].lat));
}
objpolyline = new Bmap.polyline (Polylinepointsarray, {strokecolor: "#4B0082", Strokeweight:3, strokeopacity:0.8, fillopacity:0.6, Strokestyle: ' Solid '});
Iterate through the data to assemble the data to form a Polyline object. Using the Map.addoverlay () added map, you can then add other custom methods to the map without the code.