В подсказке d3.js вместо значения отображается «[Promise] объекта» - PullRequest
Новая
       8

В подсказке d3.js вместо значения отображается «[Promise] объекта»

0 голосов
/ 17 января 2019

Я пытаюсь отобразить с помощью d3.js во всплывающей подсказке значение, возвращаемое асинхронной функцией.Значение хорошо возвращается функцией, но когда мне нужно показать всплывающую подсказку, вместо значения она содержит [объект Promise].

Я использую async / await для работы с такими асинхронными функциями, как этот:

Создание данных, которые будут содержать подсказку: 

async function jsonMethodsArray(d) {
var arr = [];
// $.getJSON is asynchronous
// so wait until the end of its execution before proceeding to the other instructions
var json = await $.getJSON("method/data" + d.id + ".json", function(json) {
    for (var i = 0; i < json.nodes.length - 1; i++) {
        var node = json.nodes[i+1];
        arr.push(node.id);
    }
});
return arr;
}

Создание и вызов подсказки: 

var tooltip = d3.tip()
.attr("class", "tooltip")
.offset([-8, 0])
.html(async function(d) {
    // jsonMethodsArray is asynchronous due to $.getJSON
    // so wait until the end of its execution before proceeding to the other instructions
    var methods = await jsonMethodsArray(d);
    console.log(methods);
    return methods.join("\n");
});
svg.call(tooltip);

Отображение или скрытие подсказки: 

.on('mouseover', tooltip.show)
.on('mouseout', tooltip.hide)

Вместо отображения значений массива, возвращенного во всплывающей подсказке, он отображает [обещание объекта].

Я новичок в Javascript, d3.js и асинхронных функциях, вы можете мне помочь?

1 Ответ

0 голосов
/ 23 января 2019

Пожалуйста, посмотрите на следующую ссылку Документация d3 Следуя этим примерам, вы получаете содержимое подсказки в переменную при инициализации.

Выполнить: var methods = await jsonMethodsArray(d); при запуске.

Позже присоедините методы к элементу всплывающей подсказки

...