how to align the number in MarkerClusterer icon?

chimbu

I have using google map api v3 and i want to display custom cluster pin with number alignment like this:

enter image description here

I have tried this code:

var clusterOptions = {
        zoomOnClick: false,
        styles: [{height: 36, width: 36, url: location.href.substring(0, location.href.lastIndexOf("/")+1)+'images/pushpin_cluster.png' }]}
    var markerCluster = new MarkerClusterer(map, markers, clusterOptions);

But it's showing like this:

enter image description here

how can i align the Cluster icon number into the blue box.

thanks in advance...

chimbu

I have tried this code is working well:

var clusterOptions = {
        zoomOnClick: false,        
        styles: [{ anchor:[2,22],textColor: "white",height: 36, width: 36, url: location.href.substring(0, location.href.lastIndexOf("/")+1)+'images/pushpin_cluster.png' }]}
    var markerCluster = new MarkerClusterer(map, markers, clusterOptions);

anchor:[2,22] -The position (in pixels) from the center of the cluster icon to where the text label is to be centered and drawn. The format is [yoffset, xoffset] where yoffset increases as you go down from center and xoffset increases to the right of center. The default is [0, 0].

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Java

How to vertically align text with icon font?

From Java

How to align Big Icon at the center, inside smaller row in Flutter?

From Dev

Markerclusterer set marker cluster icon depending on markers inside it

From Dev

how to align the number in MarkerClusterer icon?

From Dev

How to vertically align a 'span' in a 'div' with icon present?

From Dev

Google maps api v3: Text position on MarkerClusterer Icon

From Dev

How to align badge on top of icon

From Dev

How can I align my icon to be in center of my square box?

From Dev

How to vertical align icon inside label and button in the same way

From Dev

How to align text next to an icon with CSS?

From Dev

how can I align font awesome icon in bootstrap button?

From Dev

Google Maps API Markerclusterer Plus set icon

From Dev

How to center align ion icon inside button?

From Dev

How to align datepicker icon appearing below the datepicker textbox properly?

From Dev

How to vertically align an icon next to text in Bootstrap 3

From Dev

How to make Icon and Text align Left side on JButton

From Dev

How to align icon to the left with text to the right?

From Dev

How to vertically align an icon inside a span

From Dev

How to align material icon on right of a input field?

From Dev

How to use MarkerClusterer with my maps

From Dev

How to align an icon to the right of content

From Dev

How do i right align an icon set arrow under conditional formatting so that both number and arrow are on right side of cell neatly together?

From Dev

How to vertically align icon font

From Dev

How can I align my logo and menu icon on a mobile device

From Dev

how can I align font awesome icon in bootstrap button?

From Dev

How to align uilabel icon with text in iOS

From Dev

how to get image icon to align right in a Linear Layout?

From Dev

QPushButton: How to align icon and text

From Dev

bootstrapTable: how to vertical align the detail-icon?

Related Related

  1. 1

    How to vertically align text with icon font?

  2. 2

    How to align Big Icon at the center, inside smaller row in Flutter?

  3. 3

    Markerclusterer set marker cluster icon depending on markers inside it

  4. 4

    how to align the number in MarkerClusterer icon?

  5. 5

    How to vertically align a 'span' in a 'div' with icon present?

  6. 6

    Google maps api v3: Text position on MarkerClusterer Icon

  7. 7

    How to align badge on top of icon

  8. 8

    How can I align my icon to be in center of my square box?

  9. 9

    How to vertical align icon inside label and button in the same way

  10. 10

    How to align text next to an icon with CSS?

  11. 11

    how can I align font awesome icon in bootstrap button?

  12. 12

    Google Maps API Markerclusterer Plus set icon

  13. 13

    How to center align ion icon inside button?

  14. 14

    How to align datepicker icon appearing below the datepicker textbox properly?

  15. 15

    How to vertically align an icon next to text in Bootstrap 3

  16. 16

    How to make Icon and Text align Left side on JButton

  17. 17

    How to align icon to the left with text to the right?

  18. 18

    How to vertically align an icon inside a span

  19. 19

    How to align material icon on right of a input field?

  20. 20

    How to use MarkerClusterer with my maps

  21. 21

    How to align an icon to the right of content

  22. 22

    How do i right align an icon set arrow under conditional formatting so that both number and arrow are on right side of cell neatly together?

  23. 23

    How to vertically align icon font

  24. 24

    How can I align my logo and menu icon on a mobile device

  25. 25

    how can I align font awesome icon in bootstrap button?

  26. 26

    How to align uilabel icon with text in iOS

  27. 27

    how to get image icon to align right in a Linear Layout?

  28. 28

    QPushButton: How to align icon and text

  29. 29

    bootstrapTable: how to vertical align the detail-icon?

HotTag

Archive