dogrunjp
9/12/2014 - 3:00 AM

d3.js の軸のラベルのフォーマット方法。 tickFormatはラベルの数値のフォーマットに主に使うメソッドのようですが、文字列のフォーマターとして利用することもできます。この例ではテキストがある文字数を超えると「…」に置き換えるように設定しています。

d3.js の軸のラベルのフォーマット方法。 tickFormatはラベルの数値のフォーマットに主に使うメソッドのようですが、文字列のフォーマターとして利用することもできます。この例ではテキストがある文字数を超えると「…」に置き換えるように設定しています。

formatter4d3axis_labe_text.js
content_copyfile_download
//scale(x)がバインドされているのでこのスケールのドメインに対するフォーマッターとなります
var xAxis = d3.svg.axis().scale(x).orient("bottom")
    tickFormat(function(d){if(d.length <= 22){return d;} else if (d.length > 22){txt = d.substr(0,22)+'…';return txt;}})