Блог

Главная - Вопросы по программированию - Ссылки SVG не работают после перехода, выполненного в d3.js

Ссылки SVG не работают после перехода, выполненного в d3.js

#svg #d3.js

#svg #d3.js

Вопрос:

Ссылки, прикрепленные к каждому элементу, отлично работают до выполнения какой-либо сортировки / перехода. Ниже приведен код, в котором ссылки добавляются к элементам rect. 

 var rect = svg.selectAll("rect")
               .data(data)
               .enter()
               .append("svg:a")
               .attr("xlink:href", function(d){ return d.url })
               .attr("target", "_blank")
               .append("svg:rect")
               ......

Однако, как только выполняется приведенная ниже функция сортировки / код перехода, гиперссылки, добавленные выше, больше не работают. Я попытался снова append <a> использовать атрибуты, как в приведенном выше коде, но это не сработало..

 var sortSquares2 = function() {
    svg.selectAll("rect")
         .sort(function(a, b){ return a.order - b.order; })
         .transition()
         .duration(1200)
         ........
         }

Ответ №1:

Проблема в том, что вы выбираете rect элементы, но добавляете a элементы. Ваш переход выбирает только rect элементы, а не a элементы и работает с ними.

Чтобы исправить, выберите и добавьте то же самое. Вероятно, в этом случае вам нужен элемент самого высокого уровня (т. Е. a ).

Комментарии:

1. Спасибо за ваш ответ. Я не уверен, понимаю ли я. Не могли бы вы показать мне пример. В моей функции сортировки я добавляю весь тот же код, что и в моей переменной rect? Или мне просто добавить ‘a’ в мою функцию сортировки?

2. Когда вы сортируете, делайте selectAll("a") и не selectAll("rect") делайте .

3. Если я это сделаю, ссылки останутся, однако только пара квадратов из визуализации фактически выполняет переход. Разве элементы ‘rect’ также не должны быть выбраны?

4. Да, если вы устанавливаете атрибуты для rect элементов, вам также необходимо их выбрать. Аналогично тому, как вы добавляете их в первую очередь.

5. Еще раз спасибо… есть ли шанс, что вы можете быть немного более конкретными (больше, чем вы уже были)? Как вы, вероятно, можете сказать, я совсем новичок, и то, что я пытаюсь на основе ваших предложений, не помогает.. Я уверен, что я все еще упускаю из виду что-то сверхосновное..