小编Ren*_*ter的帖子

D3 树形图布局调整大小

我在 RAP 上下文中使用 d3 树形图布局。因此,我的树状图嵌入在视图中,并且应该在最初和调整大小后填充该视图。

我阅读了一些有关动态更新树形图的主题,但我觉得它们都没有准确解决我的问题。

this._treemap = d3.layout.treemap()
    .value(function(d){return d._value})
    .children(function(d) { return d._items })
    .size([800,300])
    .padding(4)
    .nodes(this);

 var cells = selection
    .data(this._treemap)
    .enter()
    .append("svg:g")
    .attr("class", "item")
    .append("rect")
    .attr("x", function(d){return d.x;})
    .attr("y", function(d){return d.y;})
    .attr("width", function(d){return d.dx;})
    .attr("height", function(d){return d.dy;})
    .attr("fill", function(d){return d.children ? color(d._text) : color(d.parent._text)})
    .attr("stroke", "black")
    .attr("stroke-width",1);
Run Code Online (Sandbox Code Playgroud)

树状图初始化时设置固定大小。所有计算值(值,x,y,dx,dy)取决于大小集。我使用这个树形图在 svg 中绘制一些矩形。

我已经有一个更新函数可以识别视图的大小调整,并且有很多示例以某种方式处理更新树形图布局,但我无法将它们放在一起。

_updateLayout: function() {

    this._width = this._chart._width;
    this._height = this._chart._height;
    console.log(this._height);
    console.log(this._width);
    this._layer = this._chart.getLayer( "layer" );
Run Code Online (Sandbox Code Playgroud)

我想用新的大小和位置值更新矩形,但如何将这些值放入布局中?除了创建新布局之外应该还有另一种选择,对吗?

javascript treemap d3.js

5
推荐指数
1
解决办法
2611
查看次数

标签 统计

d3.js ×1

javascript ×1

treemap ×1