I have added a text on my UI using g element with svg. However, I am stuck to put another text on UI. Is there a way instead of copy and paste the following code to duplicate another text?
var legendData = [{ color: "white", text: "MyData" }];
var legends = svg.selectAll("g legends").data(legendData);
var legendBox = legends.enter()
.append("g")
legendBox.append("text")
.attr("dx", function (d) { return 20 })
.attr("dy", function (d) { return 15 })
.text(function (d) { return d.text })
.attr("stroke", "white")
// is it right way ????
var legendData2 = [{ color: "white", text: "MyData2" }];
var legends2 = svg.selectAll("g legends").data(legendData2);
var legendBox2 = legends.enter()
.append("g")
legendBox2.append("text")
.attr("dx", function (d) { return 20 })
.attr("dy", function (d) { return 15 })
.text(function (d) { return d.text })
.attr("stroke", "white")
sum up based on Lars comments:
var legendData = [{ color: "white", text: "MyData", dx: 20, dy: 15 },
{ color: "white", text: "MyData2", dx: 20, dy: 25 },
{ color: "white", text: "MyData3", dx: 20, dy: 35 }];
var legends = svg.selectAll("g legends").data(legendData);
var legendBox = legends.enter()
.append("g")
legendBox.append("text")
.attr("dx", function (d) { return 20 })
.attr("dy", function (d) { return 15 })
.text(function (d) { return d.text })
.attr("stroke", "white")
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.