Маленькие кратные: как добавить ось? - PullRequest
Новая
       29

Маленькие кратные: как добавить ось?

3 голосов
/ 07 апреля 2019

Кто-нибудь знает, как добавить ось Y к этому примеру ниже? https://bl.ocks.org/mbostock/e1192fe405703d8321a5187350910e08

В этом примере показано, как создать несколько диаграмм одновременно с динамически рассчитанным значением yScale для каждого ряда данных.Но как добавить yAxis к каждому графику, используя локальный yScale?

1 Ответ

2 голосов
/ 07 апреля 2019

Учитывая пример, который вы связали, единственное, что вам нужно, это установить локальную переменную для каждого SVG: 

axis.set(this, d3.axisRight(ty).ticks(3));

Здесь я использую ticks(3), потому что у нас не так уж многотам вертикальное пространство, а ty - это масштаб, созданный для каждого SVG.Затем вы позже используете эту локальную переменную как: 

svg.each(function(){
    axis.get(this)(d3.select(this)
        .append("g")
        .attr("transform", "translate(" + width + ",0)"));
});

Вот обновленные bl.ocks: https://bl.ocks.org/GerardoFurtado/7ce71db8470c75940feed0d64b3f1f25/fb38b0867f434268e254f08e469cf38113179472

PS: обратите внимание на тот факт, что здесь я 'м, используя ... 

axisGenerator(groupSelection)

... вместо способа более традиционного шаблона ... 

groupSelection.call(axisGenerator)

... потому что мы не можем получить this с традиционнымшаблон.Для использования традиционной скороговорки без метода each вам понадобится странная вспомогательная функция, например: 

svg.append("g")
    .attr("transform", "translate(" + width + ",0)")
    .call(generateAxis);

function generateAxis(selection) {
    selection.call(axis.get(selection.node()));
};
...