У меня возникли проблемы с пониманием того, почему приведенный ниже код не работает для меня.шкала оси y undefined в пределах анонимной функции
ПРИМЕЧАНИЕ: Я использую D3 v4.
// DATA JOIN
var dataJoin = vis.svg.selectAll(".group")
.data(vis.displayData);
// ENTER + UPDATE
var group = dataJoin.enter().append("g")
.attr("class", "group");
group.append("path") // ENTER
.attr("class", "line")
.style("opacity", 0.5)
.merge(group) // ENTER + UPDATE
.transition()
.duration(800)
.attr("d", function(d) {
return vis.y(d.beginDate); <------- vis.y() is undefined
});
Для каждого элемента в displayData
Я хотел бы создать отдельный пользовательский элемент пути (то есть, пользовательские формы), которые расположены вдоль оси у. Каждый элемент пути должен использовать шкалу vis.y(), чтобы я мог разместить элемент пути в соответствующей точке вдоль оси y.
HOWEVER, vis.y() не определено внутри вызова функции .attr. Почему? Я построил другую визуализацию D3 (хотя, они использовали версию 3), и использовал масштаб внутри вызова функции .attr, так почему это проблема сейчас?
В основном я пытаюсь добавить пользовательскую форму с настраиваемым путем для каждого элемента, который начинается в другом месте по оси y. Если вы чувствуете, что я делаю это неправильно, не стесняйтесь давать мне другие предложения.
Он использует следующую шкалу:
vis.y = d3.scaleTime()
.range([vis.height, 0]);
vis.y.domain([
d3.min(vis.displayData, function(d) { return d.beginDate; }),
d3.max(vis.displayData, function(d) { return d.endDate; })
]);
Данные массив объектов структурированы, как показано ниже:
var obj = {
name: d.Name,
type: d.type,
beginDate: d.beginDate,
endDate: d.endDate,
eventDate: d.eventDate
};
Я не могу сказать, почему 'vis.y' не определен потому что у вас недостаточно кода (т. е. как создается vis и в какой области)?Я бы рекомендовал опубликовать полный пример кода, который реплицирует проблему. Тем не менее, я что-то пропустил здесь, 'vis.y' - это масштаб, он не вернет строковый атрибут пути' d'. – Mark
@Mark, вот скрипка: https://jsfiddle.net/Ltjjj5p2/, но я не смог воспроизвести проблему. Если я добавлю все внутри функции d3.json(), то 'vis.y' не определено. Как только я вытаскиваю его за его пределы, он работает. Так что-то заставляет меня думать, что это проблема? – Keven
На самом деле, я думаю, что я нашел преступника, но я до сих пор не знаю, почему это повлияет на него. Мой код завернут внутри 'function loadData() {}'. Когда страница загружается, я вызываю 'loadData();' непосредственно. Когда я удаляю вызов функции и вытаскиваю нагрузку 'd3.json()' за пределами нее 'vis.y', доступен. Почему это? – Keven