Добавить элемент D3 в угловую директиву

Question

Добавить элемент D3 в угловую директиву

0

Я очень новичок в d3.js и хочу преобразовать этот код: http://codepen.io/budelman/pen/NqZwpm Я нашел угловую директиву. Одна из проблем, с которыми я сталкиваюсь, заключается в том, что в угловой директиве я имею доступ только к одному "элементу". Я не могу понять, как добавить легенду текстового поля div # в мой угловой код.

Я пытался:

// Shove the text into the div with ID #textbox            
svg.append('div')
.attr('id','textbox')
.select("#textbox")
.text(string);
})

Но это не сработает. Может ли кто-нибудь указать мне в правильном направлении? Спасибо!

Stella 28 март 2016, в 19:13

Источник

0

Вы используете цепочку методов , что означает, что когда вы вызываете .select("#textbox") он ищет элемент с id textbox в добавленном вами div , потому что вы связали его с методом, который возвратил div. Либо полностью избавьтесь от выбранной строки, либо измените ее на svg.select("#textbox")...
JSBob 28 март 2016, в 16:41

Теги:

javascript

jquery

angularjs

d3.js

css

2 ответа

Ещё вопросы

Вы используете цепочку методов , что означает, что когда вы вызываете .select("#textbox") он ищет элемент с id textbox в добавленном вами div , потому что вы связали его с методом, который возвратил div. Либо полностью избавьтесь от выбранной строки, либо измените ее на svg.select("#textbox")...

Stella · Answer 1 · 2016-03-28T23-53-00.000Z

Я понял, насколько глупым этот вопрос. Все, что мне нужно, это добавить новый элемент в элемент:

d3.select(element[0]).append("div").attr("id","textbox");

z.a. · Answer 2 · 2016-03-28T15-43-00.000Z

это то, что у вас есть в исходном коде,

.on("mouseover", function(d) {
            //some code

            // Shove the text into the div with ID #textbox
            d3.select("#textbox")
                .html("")
                .append("text")
                .html(string);
        })

что означает, что вам просто нужен пустой div с id, а затем вставьте html в него. Я не уверен, почему вы пытаетесь добавить #textbox, а затем вставьте html. просто имейте в своей директиве. таким образом вы можете самостоятельно выбрать с помощью d3

Моя цель - создать угловую директиву, чтобы обернуть карту и легенду (текстовое поле). В конце концов, HTML-код будет выглядеть примерно так: <map val = map_data> </ map>
это нормально. положить все в шаблон директивы