在d3js代码

时间:2016-04-08 12:35:02

标签: angularjs d3.js angular-promise angular-translate

我正试图找到一种方法来使用角度承诺与d3js ...

我已将代码简化为以下代码段:

d3.select("body")
    .append("span")
    .text(function (d) {
         $translate("SOME_KEY" + d.name).then(function (translation) {
           return translation;
         });
    });

问题在于,.text()调用在$translate服务返回promise的结果之前返回。

有人可以为上述问题提供解决方案吗?

P.S。 为了完整性'为此,必须提到$ translate是角度翻译服务,上述代码在ng 1.5组件控制器中运行。

编辑:这是完整的代码:

d3Service.d3().then(function (d3) {
    var diameter = 300;

    var svg = d3.select($element[0])
        .append('svg')
        .attr('width', diameter)
        .attr('height', diameter);

    var bubble = d3.layout.pack()
        .size([diameter, diameter])
        .value(function (d) {
            return d.size;
        })
        .padding(5);

    var nodes = bubble.nodes(ctrl.d3Data)
        .filter(function (d) {
            return !d.children;
        });

var vis = svg
    .selectAll('circle')
    .data(nodes)
    .enter()
    .append('g')
    .attr('class', 'node')
    .attr('transform', function (d) {
        return 'translate(' + d.x + ',' + d.y + ')';
    });

vis.append('circle')
    .attr('r', function (d) {
        return d.r;
    })
    .attr('class', function (d) {
        return d.className;
    });

vis.append('text')
    .text(function (d) {
        $translate('DOMAIN_ENUM.CHILDCARE_WORKER_TYPE.' + d.name).then(function (translation) {
            return translation;
        });
    })
    .style('text-anchor', 'middle')
    .style('font-size', 'small')
    .style('fill', 'white');
 });

0 个答案:

没有答案