Save 36% for Black Friday! Learn more

All threads / How do I customize a Google Maps marker (like AirBNB)?

Ask A Question

Notifications

You’re not receiving notifications from this thread.

How do I customize a Google Maps marker (like AirBNB)?

Taylor Cooney asked in General

I'm curious if anyone has experience customizing the marker in Google Maps, a la AirBNB . I understand how the icon works but I haven't had success replicating the marker with the arrow, and price exactly like the photo.

let marker = new google.maps.Marker({
        position: pos,
        map: this.map,
        title: facility.name,
        icon: {
          path: 'M22-48h-44v43h16l6 5 6-5h16z',
          fillColor: '#00CCBB',
          fillOpacity: 1,
          strokeColor: '',
          strokeWeight: 0

        },
        label: {
          text: "$75",
          color: "#FFF",
          fontSize: "14px",
          fontWeight: "bold"
        }
      })
Join the discussion

Want to stay up-to-date with Ruby on Rails?

Join 39,376+ developers who get early access to new tutorials, screencasts, articles, and more.

    We care about the protection of your data. Read our Privacy Policy.

    logo Created with Sketch.

    Ruby on Rails tutorials, guides, and screencasts for web developers learning Ruby, Rails, Javascript, Turbolinks, Stimulus.js, Vue.js, and more. Icons by Icons8

    © 2020 GoRails, LLC. All rights reserved.