ver.3ã¾ã§ã¯ãƒ¬ãƒ³ã‚¸ã«ã‚«ãƒ©ãƒ¼ã‚’æŒ‡å®šã—ãŸå ´åˆã€hexで返ってきた。

D3 ver.3

> var colorScale = d3.scaleLinear().domain([0, 100]).range(["#cccccc", "#ff0000"])
> colorScale(20)
<- "#d6a3a3"

ver.4 では、rgb形式の文字列で返ってくる。

D3 ver.4

> var colorScale = d3.scaleLinear().domain([0, 100]).range(["#cccccc", "#ff0000"])
> colorScale(20)
<- "rgb(214, 163, 163)"

どうやら、hexに変換するようなメソッドも無いっぽい。

> var c = colorScale(20)
> d3.color(c).toString()
<- "rgb(214, 163, 163)"

D3のスケールを他のライブラリと組みわせて使いたい時に、相手のライブラリがhexã§ã®ã‚«ãƒ©ãƒ¼æŒ‡å®šã—ã‹å—ã‘å–ã‚Œãªã„å ´åˆãŒã‚ã‚‹ã®ã§ã€ã¨ã‚Šã‚ãˆãšã€hexã«å¤‰æ›ã™ã‚‹ãƒ¡ã‚½ãƒƒãƒ‰ã‚’è¿½åŠ ã—ã¦å¯¾å¿œã—ã¦ã¿ãŸã€‚

> d3.color.prototype.toHex = function(){ return ["#", this.r.toString(16),  this.g.toString(16), this.b.toString(16) ].join("") ; }
> d3.color(c).toHex()
<- "#d6a3a3"