#javascript #d3.js
#javascript #d3.js
Вопрос:
Я пытаюсь установить заполнение штрихов в моей гистограмме почти так же, как если бы у вас была порядковая шкала:
x = d3.scaleLinear()
.domain([fist, last])
.rangeRound([bottom, top])
.padding(someFractionBetweenZeroAndOne)
Нет. Это не работает. Итак, тогда я направляюсь к документации API, там нет .padding
метода в непрерывных масштабах!
Ну, я мог рассчитать ширину полосы вручную, но действительно ли нет интегрированного padding
решения, доступного для непрерывных масштабов?
Ответ №1:
Нет смысла иметь заполнение в линейном масштабе!
Однако есть несколько альтернатив добавления некоторого пространства к столбцам, например, использование групп (как это делает Босток в этом примере) и установка положения прямоугольников внутри группы таким образом, чтобы у нее оставалось некоторое пространство для соседей.
Другой альтернативой является изменение положения и размеров прямоугольников (как вы сказали, «вычислите ширину моей полосы вручную»). Например, в этой демонстрации я изменяю ширину каждой полосы на 90% от ширины каждой ячейки.
var data = [{x:0, y:10},
{x:2, y:40},
{x:4, y:70},
{x:6, y:30},
{x:8, y:20}];
var svg = d3.select("body")
.append("svg")
.attr("width", 300)
.attr("height", 200);
var xScale = d3.scaleLinear()
.domain([0, 10])
.range([0, 300]);
var barWidth = xScale.domain()[1]/data.length;
var yScale = d3.scaleLinear()
.domain([0, 80])
.range([200, 0]);
var bars = svg.selectAll(".bars")
.data(data)
.enter()
.append("rect");
bars.attr("x", function(d){ return xScale(d.x)})
.attr("y", function(d){ return yScale(d.y)})
.attr("width", function(d,i){ return xScale(barWidth) * 0.9})
.attr("height", function(d){ return 200 - yScale(d.y)});
rect {
fill: teal;
}
<script src="https://d3js.org/d3.v4.min.js"></script>
Комментарии:
1. Да, на данный момент я вычисляю ширину полосы и смещения аналогичным образом. Что более важно, есть ли, следовательно, какой-либо способ применить заполнение к функции гистограммы bin (для настройки x0 amp; x1), учитывая, что часто ее конечной целью является отображение порядковой функции в непрерывном масштабе (т. Е. То, что я пытаюсь сделать)?
2. Насколько я знаю, x0 и x1 автоматически генерируются функцией гистограммы. Я предлагаю вам опубликовать этот конкретный вопрос в качестве другого сообщения.
3. На самом деле, я предполагаю, что технически ответ по-прежнему таков: это не имеет смысла , потому что, если у вас есть ячейка, масштаб первой ячейки которой равен
[0,10]
, с заполнением 20% для эффективного отображения[1,9]
, наблюдатель может запутаться, попадает ли значение0.5
в эту ячейку.4. Действительно: у вас не может быть пробелов между интервалами класса ( mathworld. wolfram.com/FrequencyDistribution.html ). Вы можете просто манипулировать графическим результатом, но только минимально, чтобы разделить столбцы.