3

这是一个我似乎无法弄清楚的简单问题——我想做的就是改变页面上元素的位置。我尝试了以下方法：

// Text
body = d3.select('body')
sometext = body.append('text').text('testing') // text appears

// Different Ways i've tried to move it
.attr('cx', 40)
.attr('x', 40)
.attr("transform", "translate("40, 100")

然而，这些都没有移动文本——我错过了什么（http://jsfiddle.net/Hn5JX/）？我在页面上移动 svg 元素时遇到了同样的问题，我只是认为这在 jsfiddle 上更容易看到。感谢您对基本问题的帮助，

4

1 回答 1

6

这是使用 d3js 移动文本的示例。 http://jsfiddle.net/JnNtZ/

确保包括：

"http://mbostock.github.com/d3/d3.js"

然后包括以下javascript

// Create an svg "canvas" to place text on
var w = 400, h = 400;    
var vis = d3.select("body")
  .append("svg")
    .attr("width", w)
    .attr("height", h);

// Add text and set attributes
var text1 = vis.append('text').text('text1');
var text2 = vis.append('text').text('text2');
text1.attr("y", "300").style("fill", "red");
text2.attr("x", "200").attr("y", "403").style("fill", "blue");  // Notice how this text is on the edge of the canvas

​我认为您遇到的问题是，在选择文本时，您将获得一个 HTML 元素而不是 SVGText 元素（似乎您需要一个 SVG 元素来允许 d3js 进行操作）。您还需要确保文本的 (x,y) 坐标位于给定画布内。

于 2012-06-14T06:44:55.320 回答