D3.JS- Форматирование значений делений с порядковой осью шкалы

Я использую порядковую шкалу на моей оси:

var xBarScale = d3.scale.ordinal()
    .rangeRoundBands([0, width], .1)
    .domain(d3.range(data.length));

var xBarAxis = d3.svg.axis()
    .scale(xBarScale)
    .orient("bottom");

Мои галочки находятся в моем массиве данных. Каков наилучший способ отформатировать значения галочки (используя метод D3), чем просто перечислить каждое из них в массиве, как я сделал здесь:

 xBarAxis.tickValues([data[0].q,data[1].q,data[2].q,data[3].q,data[4].q]);

arrays scale d3.js ordinal
person NewToJS    schedule 30.06.2014    source источник
comment
поскольку вы используете порядковую шкалу, вы можете поместить свои значения data[i].q в массив и использовать этот массив для шкалы: .domain(_yourarray_) - тогда вы сможете вообще опустить свойство .tickValues   -  person Herbert Hubert    schedule 30.06.2014

Ответы (1)


arrow_upward
1
arrow_downward

Я использую D3 v4 и вот как бы я это сделал:

var xBarScale = d3.scale.ordinal()
    .rangeRoundBands([0, width], .1)
    .domain(d3.range(data.length));

var xBarAxis = d3.axisBottom( xBarScale )
    .tickFormat((d)=> d + ' position' ) // just an example of formatting each Tick's text
    .tickValues( data.map(d => d.q) )  // creates an Array of `q` values

Что касается моего примера, вы можете установить tickFormat форматировать ваши текстовые метки, как вы хотите

person vsync    schedule 22.01.2017