Custom overlay of Baidu Map)

Baidu map provides the default marker as the default point mark or image annotation. In addition to location, you can also set image icons to achieve custom effects. However, this is obviously quite limited. We need to overlay the overlay to show the vertices.

This document provides a custom covering named clustermarker, which is similar to a complicated tag. In addition to the conventional position (point), it can also set text and style, and there will be a certain ing relationship between text and style, different texts correspond to different styles. The ing interface is also open and can be set on its own.

Constructor:

Clustermarker (point, text, opt_options): point indicates location information; text indicates text information; optional parameter opt_options is an object, for example, {styles: mystyles, bounds: mybounds }, styles allows you to set a custom style. If you do not set styles, use the default style (the default image is taken from here). bounds is set for clustermarkerer, for example, if this is an aggregation of several vertices, it can represent the bounds range of these vertices.

Method interface:

Getpoint () and setpoint (point) are used to obtain and set the display position.

Gettext () and settext (text) are used to obtain and set the displayed text.

Getbounds () and setbounds (bounds) are used to obtain and set the range of aggregation points, if any.

Getcalculator () and setcalculator (calculator) are used to obtain and set the ing between text and style. The default ing relationship is to convert the text into numbers and round 10 as the corresponding style image index. For example, if the text is 9 and the index is 0, then the 24 text corresponds to the index 2 style.

You can add a click event response using the addeventlistener method.

The clustermarker naming is a point mark similar to marker. Cluster indicates accumulation, for example, text indicates that a text mark is accumulated near a point. In fact, this is the intermediate product of the markercluster for Baidu GEO chart.CodeWill be included in the next articleArticle"Clustermarkerer Baidu GEO Chart.

Demo address: simple example
Complex example (set different styles)

You know how to find the source code. Original article link.