Personalized map

  • Call personalized map style with style ID (official recommendation)
  • The personalized map is called with the style JSON

Draw points, lines, and surfaces

  1. Add logo
var myIcon = new BMapGL.Icon("https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fd.paper.i4.cn%2Fmax%2F2018%2F03%2F02%2F14%2F151997093 5051 _082969 jpg&refer = HTTP % 3 a % 2 f % 2 fd. Paper. I4. Cn&app = 2002 & size = f9999, 10000 & q = a80 & n = 0 & g = 0 n & FMT = jpeg? The SEC = 1628945359 & 81 t = b6 e12afcbbe2f136541099caa306d8", new BMapGL.Size(300, 200), { anchor: new BMapGL.Size(100, 100), imageOffset: New bmapgl. Size(20,220) // Set image offset}); Var marker = new bmapgl. marker (point, {icon: myIcon}); var marker = new bmapgl. marker (point, {icon: myIcon}); map.addOverlay(marker);Copy the code

Open the browser we can see the pig small fart!!

  1. Line Polyline
Var polyline = new bmapgl. polyline ([new bmapgl. Point(116.399, 39.910), new bmapgl. Point(116.405, 39.920), new bmapgl. Point(116.405, 39.920), New bmapgl.point (116.425, 39.900), new bmapgl.point (115.475, 39.800)], {strokeColor:"blue", strokeWeight:2, StrokeOpacity: 0.5}); map.addOverlay(polyline);Copy the code
  1. Plane Polygon
Var polygon = new bmapgl. polygon ([new bmapgl. Point(116.387112,39.920977), new bmapgl. Point(116.385243,39.913063), new bmapgl. Point(116.385243,39.913063), New BMapGL. Point (116.394226, 39.917988), the new BMapGL. Point (116.401772, 39.921364), New bmapgl. Point(116.41248,39.927893)], {strokeColor:"blue", strokeWeight:2, strokeOpacity:0.5});Copy the code

Text annotation

  • Everything that is overlaid or overlaid on the map is collectively referred to as the map overlay. Coverings have their own geographic coordinates, and when you drag or scale the map, they move accordingly.
  • Covering is mainly divided into: annotation (dot annotation, polyline, polygon, circle, text annotation), information window, layer.
  • var content = “label”;
  • Var label = new BMapgl. label (content, {create text annotation position: point, set the geographic location of the annotation offset: new BMapgl. Size(10, 20) Set the offset of the annotation

})

  • map.addOverlay(label);
If the CSS property name contains a hyphen, remove the hyphen and capitalize the following letters

Information window

  • Everything that is overlaid or overlaid on the map is collectively referred to as the map overlay. Coverings have their own geographic coordinates
  • Var opts = {width: 200, height: 100, title: “Hello

}

  • var infoWindow = new BMapGL.InfoWindow(“World”, opts); Create an information window object
  • map.openInfoWindow(infoWindow, map.getCenter());