Interactive Choropleth Map - Highlighting - getcolor function - leaflet

Question

I'm trying to create a map of bicycle routes which will get color from properties from geojson file. It is based on Interactive Choropleth Map. The problem I have at the moment is highlighting. This part of the code checks in geojson properties the colour of route:
function getColor(d) {
return d == 'red' ? 'red' :
d == 'blue' ? 'blue' :
d == 'green' ? 'green' :
d == 'black' ? 'black' :
d == 'yellow' ? 'yellow' :
'orange';
}
function style(feature) {
return {
weight: 2,
opacity: 1,
color: getColor(feature.properties.colour),
dashArray: '3',
fillOpacity: 0.7,
};
}
It works ok but when I try to use the same function "get color" on highlighting :
function highlightFeature(e) {
var layer = e.target;
layer.setStyle({
weight: 5,
color: getColor(feature.properties.colour),
dashArray: '',
fillOpacity: 0.7
});
It doesn't highlight in the colors from properties of geojson. It's probably some small problem but I'm still learning and I don't understand it. Could someone explain it and point a solution, please? Thanks very much!
Here's a working example (not full working of course as I'm still learning):
http://members.upcpoczta.pl/w.racek/mapa.html
Thanks!

Answer 1

In your highlightFeature method, you have the setStyle method where you're referencing feature which doesn't exist. The feature is defined in e.target.feature. So this would work:
function highlightFeature(e) {
e.target.setStyle({
weight: 5,
color: getColor(e.target.feature.properties.colour),
dashArray: '',
fillOpacity: 0.7
});
}
But since you're not changing the color (and the opacity) you might as well leave those out entirely, which also solves the problem :)