В диаграмме MultiBar с nvd3/d3 отображаются только метки для каждого другого тика по оси x. Как я могу заставить их всех появиться?
Данные:
nvd3TestData = [
{
values:[
{x:"M",y:1},
{x:"T",y:2},
{x:"W",y:3},
{x:"R",y:3},
{x:"F",y:4},
{x:"S",y:5},
{x:"U",y:6}
],
key:"Apples"
},
{
values:[
{x:"M",y:5},
{x:"T",y:2},
{x:"W",y:6},
{x:"R",y:8},
{x:"F",y:2},
{x:"S",y:4},
{x:"U",y:1}
],
key:"Zebras"
}
]
Создание диаграммы (выведенной из директивы angularjs):
nv.addGraph → chart = nv.models.multiBarChart() .stacked(правда) .showControls(ложь)
chart.xAxis
.axisLabel(attrs.xAxisLabel)
chart.yAxis
.axisLabel(attrs.yAxisLabel)
.tickFormat(d3.format(',r'))
console.log element
d3.select(element[0].children[0])
.datum(nvd3TestData)
.call(chart)
nv.utils.windowResize(chart.update)
Вывод:
![Output]()
Ожидаемый результат будет иметь все 7 меток:
M T W R F S U
Ответы
Ответ 1
Я смотрел на nvd3.org и не мог найти никакой реальной документации, но, проверяя исходный код, я нашел https://github.com/novus/nvd3/blob/master/src/models/multiBarChart.js, который показал логический параметр диаграммы "reduceXTicks" с комментарием, указывающим, что он сделает то, что вы хотите. Я попробовал это с одним из примеров диаграмм, и это сработало. В частности, я использовал:
chart
.reduceXTicks(true)
Ответ 2
Нет надлежащей документации, но вы можете ее получить.
Просто добавьте нижнюю строку к диаграмме
уменьшитьXTicks: false
Отдых будет следовать.
Благодаря