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.

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
      }
   });
  • 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 7 '18 at 13:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.