Wie fügt man Text an eine Scrollbox an?

Question

Ich bin derzeit mit einem Scroll-Feld mit dem Inhalt „Some Text“ in der Box:

<style> 
.scroll { 
background: #ff8e00; 
height: 150px; 
overflow: scroll; 
width: 200px; 
border: 1px solid #000; 
padding: 10px; 
} 
</style> 

    <div class="scroll"> 
    Some Text 
</div> 

Der erscheinende Text ein Teil des div-Elements ist. Jetzt ist mein Ziel, ein Textelement in d3.js zu erstellen und es an die Scrollbox anzufügen. Das Textelement sieht so aus:

<script> 

var width = 600; 
var height = 300; 

var svg = d3.select("body") 
     .append("svg") 
     .attr("width", width)  
     .attr("height", height); 


    var text = svg.append("text") 
     .attr("dx", 1) 
     .attr("dy", 1) 
     .text("Some New Text."); 

</script> 

Ich möchte das "etwas neuen Text." erscheint in der Box. Vielleicht könnten einige von euch mir bei diesem Problem helfen. Vielen Dank.

Answer 1

Ich hoffe, dieses Snippet hilft.

var width = 600; 
 
var height = 300; 
 

 
var svg = d3.select("div.scroll") //Selects div with the class scroll 
 
    .append("svg") 
 
    .attr("width", width) 
 
    .attr("height", height); 
 

 
var text = svg.append("text") 
 
    .attr("dy", "1em") //Updating relative coordinate y 
 
    .text("Some New Text.");

.scroll { 
 
    background: #ff8e00; 
 
    height: 150px; 
 
    overflow: scroll; 
 
    width: 200px; 
 
    border: 1px solid #000; 
 
    padding: 10px; 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> 
 
<div class="scroll"> 
 
    Some Text 
 
</div>