Добавление в элемент g по идентификатору не работает должным образом в d3 js - PullRequest
Новая
       42

Добавление в элемент g по идентификатору не работает должным образом в d3 js

0 голосов
/ 19 декабря 2018

Я создал элемент g с идентификатором sdgImage и добавил к нему элемент изображения.Но я не смог добавить элемент text к элементу sdgImage 

g.append("g").attr("id", "sdgImage").
            append("svg:image")
            .attr("transform", function (d) {
                return "translate(" + arc.centroid(d) + ")rotate(" + computeImageRotation(d) + ")";
            })
            .attr("text-anchor", "middle")
            .attr("dx", "0") // margin
            .attr("dy", ".35em") // vertical-align
            .attr('width', 156)
            .attr('height', 156)
            .style("display", 'none')
            .attr("opacity", 0)
            .attr('class', style.rect)
            .on("click", imageClick)
            .attr("xlink:href", function (d) {
                return d.image ? d.image : '';
            })
d3.select("#sdgImage")
            .append("div").append("text").attr("text-anchor", "middle")
            .text('Back')
            .style("font-size", "15px")
            .style("display", function (d) {
                return d.parent && d.parent.name !== '' ? 'block' : 'none';
            })
            .attr("text-anchor", "middle")
            .attr("dx", "0") // margin
            .attr("dy", "8em") // vertical-align
            .attr('width', 30)
            .attr('height', 30)
            .style("fill", "#ffffff")
            .on("click", goBack)
            .style("cursor", "pointer")

Это то, что я получаю в браузере 

<g id="sdgImage"><image transform="translate(-70,-80)" text-anchor="middle" dx="0" dy=".35em" width="156" height="156" opacity="1" class="rect__3uHGJ" xlink:href="" style="display: block;"></image></g>
...