2

I want to use different icons based on attibute values 'art' in a Google Maps data.layer. I've defined an customIcons object with all the styling options I need.

var customIcons = {
    Ap: {
        icon: './images/pin_green.png'
    },
    Bi: {
        icon: './images/pin_yellow.png'
    },
    Wa: {
        icon: './images/pin_brown.png'
    }
};

When I try to use this object in a style function, I get an error: "a.url.substr is not a function"

   map.data.setStyle( function(feature){
    var art = feature.getProperty('art');
    var icons = customIcons[art] || {};
      return  { 
        icon: icons
      }
   });

When I use a single icon, passing the url like 

icon: {url: './images/pin_green.png'}

it works, but all points use the same icon. I've tried already a lot, but I cannot get the right syntax.

geom
  • 1,286
  • 2
  • 16
  • 27

1 Answers1

2

I needed to change the return statement, now it works:

   map.data.setStyle( function(feature){
    var art = feature.getProperty('art');
    var icons = customIcons[art] || {};
      return  { 
        icon: icons.icon
      }
   });
geom
  • 1,286
  • 2
  • 16
  • 27
  • Thanks for coming back to the question and adding the solution you found! This solved my problem and it's the only reference to it online that I've found :) – aurumpotestasest Nov 07 '18 at 13:51