Search code examples
angularjsgoogle-mapsng-map

How to remove default A B markers on ngMap


I am using ng-map in my angular application. in my map i am using directions but i don't need A and B points. please help me hide these markers. i got one solution but it's not helping in ng-map. thts,s how I apllied it.

<ng-map zoom="14"
    center="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman"
    style="height:90%" >
    <directions
      draggable="true"
      panel="p2"
      travel-mode="DRIVING"
      origin="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman"
      destination="Pier St, Jackson Bay, West Coast, New Zeland" suppressMarkers='true'>
    </directions>
    <custom-marker id="start"
      position="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman">
      <div> Start point </div>
    </custom-marker>
    <custom-marker id="end"
      position="Pier St, Jackson Bay, West Coast, New Zeland">
      <div> Ends point </div>
    </custom-marker>
  </ng-map>

or maybe i am not using it correctly. check this plunker. Help


Solution

  • Marker Icons won't show up if You add

    suppress-markers="true" in <directions> as below.

    <ng-map zoom="14"
            center="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman"
            style="height:90%" >
            <directions
              draggable="true"
              suppress-markers="true"
              panel="p2"
              travel-mode="DRIVING"
              origin="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman"
              destination="Pier St, Jackson Bay, West Coast, New Zeland" suppressMarkers='true'>
            </directions>
            <custom-marker id="start"
              position="1135 Karamea-Kohaihai Rd, Kahurangi National Park, Tasman">
              <div> Start point </div>
            </custom-marker>
            <custom-marker id="end"
              position="Pier St, Jackson Bay, West Coast, New Zeland">
              <div> Ends point </div>
            </custom-marker>
          </ng-map>
    

    OR

    options.suppressMarkers = true; just before var renderer = new google.maps.DirectionsRenderer(options); In ng-map.js