-2
我正在試圖將所謂的數據封裝到svg上的兩行文字上。現在它正在顯示六行以上的文字。有人能幫忙嗎。svg文字環繞問題
function wrap(text, width, content) {
text.each(function() {
var text = d3.select(this),
words = content.split(/\s+/).reverse(),
word,
line = [],
lineNumber = 0,
lineHeight = 1, // ems
x = text.attr("x"),
y = text.attr("y"),
dy = 0, //parseFloat(text.attr("dy")),
tspan = text.text(null)
.append("tspan")
.attr("x", x)
.attr("y", y)
.attr("dy", dy + "em");
while (word = words.pop()) {
line.push(word);
tspan.text(line.join(''));
if (tspan.node().getComputedTextLength() > width) {
line.pop();
tspan.text(line.join(" "));
line = [word];
tspan = text.append("tspan")
.attr("x", x)
.attr("y", y)
.attr("dy", ++lineNumber * lineHeight + dy + "em")
.text(word);
}
}
});
}
Thermometer.prototype.drawTick = function(t, label, labelColor, textOffset, width, tubeWidth, lineColor, scale, svg) {
svg.append("line")
.attr("id", label + "Line")
.attr("x1", width/2 - tubeWidth/2)
.attr("x2", width/2 + tubeWidth/2)
.attr("y1", scale(t))
.attr("y2", scale(t))
.style("stroke", lineColor)
.style("stroke-width", "2px")
.style("shape-rendering", "crispEdges");
if (label) {
svg.append("text")
.attr("x", width/2 + tubeWidth/2 + 15)
.attr("y", scale(t))
.attr("dy", ".5em")
.text(label)
.style("fill", labelColor)
.style("stroke", "black")
.style("font-size", "14px")
.call(wrap,30,label)
}
};
return Thermometer;
鏈接到我的小提琴是這裏 https://jsfiddle.net/corcorancr/sxs5n2cw/1/
我沒有看到任何更改? – Corcorancr
我想你沒有自己寫這個代碼(?)要弄清楚爲什麼會發生這種情況是很容易的。你試圖做什麼來調試它? –
如果很容易,請幫忙 – Corcorancr