D3.jsでのselectの使い方について

Question

###前提・実現したいこと
d3.jsを使用してsvg要素の色を変更したいと思っています。
色を決定する際にattributeの値を用いたいのですが上手くいきません。

attributeの"population"には数値が入っています。
mouseoutイベントではd3.select(this).attr("population")で値を取得できるのですが、
fillのfunctionではd3.select(this).attr("population")の返り値をコンソールに表示してみるとnullになってしまいます。

ちなみに、mouseoutイベントでは上手く動作し、svg要素の色を変更することが出来ました。

###該当のソースコード
map.selectAll('path')
.attr('fill', function(){
console.log(d3.select(this).attr("population"));
return colorScale(d3.select(this).attr("population"));
})
.on("mouseout", function(){
d3.select(this).style("fill",colorScale(d3.select(this).attr("population")));
})

###補足情報(言語/FW/ツール等のバージョンなど)
こちらのサイトを参考にしました。
http://bl.ocks.org/ofutondaisuki/991ecfc5fd49ad2cdd5f
こちらのサイトではfillのfunctionでもd3.select(this).attrが使えているようなのですが。。。。