How to text-overflow in d3.js











up vote
1
down vote

favorite












I'm using d3.js and I have some circles and some text related to each circle. I want the overflowed text to be ellipsised.



I've tried with css 



white-space: nowrap; overflow: hidden; text-overflow: ellipsis;


But it doesn't work. How should I do?



 node.append("text").attr("id", "text")

     .attr("dx", function(d) { return (d.size * (-100)) ;})

     .attr("dy", function(d) { 

          if(flag==1) {

              flag=0; return -(d.size * 57);

          } else{

              flag=1; return ((d.size * 100) + 5);

          }

     })

     .text( function(d){ return d.name;})

     .style("opacity", 1);





javascript css css3 d3.js







share|improve this question









New contributor




Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.




















  • check this : stackoverflow.com/questions/15975440/…
    – Umesh Maharshi
    Nov 12 at 20:57















up vote
1
down vote

favorite












I'm using d3.js and I have some circles and some text related to each circle. I want the overflowed text to be ellipsised.



I've tried with css 



white-space: nowrap; overflow: hidden; text-overflow: ellipsis;


But it doesn't work. How should I do?



 node.append("text").attr("id", "text")

     .attr("dx", function(d) { return (d.size * (-100)) ;})

     .attr("dy", function(d) { 

          if(flag==1) {

              flag=0; return -(d.size * 57);

          } else{

              flag=1; return ((d.size * 100) + 5);

          }

     })

     .text( function(d){ return d.name;})

     .style("opacity", 1);





javascript css css3 d3.js







share|improve this question









New contributor




Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.




















  • check this : stackoverflow.com/questions/15975440/…
    – Umesh Maharshi
    Nov 12 at 20:57













up vote
1
down vote

favorite









up vote
1
down vote

favorite











I'm using d3.js and I have some circles and some text related to each circle. I want the overflowed text to be ellipsised.



I've tried with css 



white-space: nowrap; overflow: hidden; text-overflow: ellipsis;


But it doesn't work. How should I do?



 node.append("text").attr("id", "text")

     .attr("dx", function(d) { return (d.size * (-100)) ;})

     .attr("dy", function(d) { 

          if(flag==1) {

              flag=0; return -(d.size * 57);

          } else{

              flag=1; return ((d.size * 100) + 5);

          }

     })

     .text( function(d){ return d.name;})

     .style("opacity", 1);





javascript css css3 d3.js







share|improve this question









New contributor




Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.











I'm using d3.js and I have some circles and some text related to each circle. I want the overflowed text to be ellipsised.



I've tried with css 



white-space: nowrap; overflow: hidden; text-overflow: ellipsis;


But it doesn't work. How should I do?



 node.append("text").attr("id", "text")

     .attr("dx", function(d) { return (d.size * (-100)) ;})

     .attr("dy", function(d) { 

          if(flag==1) {

              flag=0; return -(d.size * 57);

          } else{

              flag=1; return ((d.size * 100) + 5);

          }

     })

     .text( function(d){ return d.name;})

     .style("opacity", 1);





javascript css css3 d3.js




javascript css css3 d3.js






share|improve this question









New contributor




Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.











share|improve this question









New contributor




Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.









share|improve this question




share|improve this question








edited Nov 13 at 6:52









Tân Nguyễn

3,48932350




3,48932350






New contributor




Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.









asked Nov 12 at 17:30









Marco

61




61




New contributor




Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.





New contributor





Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.






Marco is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.












  • check this : stackoverflow.com/questions/15975440/…
    – Umesh Maharshi
    Nov 12 at 20:57


















  • check this : stackoverflow.com/questions/15975440/…
    – Umesh Maharshi
    Nov 12 at 20:57
















check this : stackoverflow.com/questions/15975440/…
– Umesh Maharshi
Nov 12 at 20:57




check this : stackoverflow.com/questions/15975440/…
– Umesh Maharshi
Nov 12 at 20:57

















active

oldest

votes











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});






Marco is a new contributor. Be nice, and check out our Code of Conduct.










 

draft saved


draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53267248%2fhow-to-text-overflow-in-d3-js%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown






























active

oldest

votes













active

oldest

votes









active

oldest

votes






active

oldest

votes








Marco is a new contributor. Be nice, and check out our Code of Conduct.










 

draft saved


draft discarded


















Marco is a new contributor. Be nice, and check out our Code of Conduct.













Marco is a new contributor. Be nice, and check out our Code of Conduct.












Marco is a new contributor. Be nice, and check out our Code of Conduct.















 


draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53267248%2fhow-to-text-overflow-in-d3-js%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







-

Popular posts from this blog

Biblatex bibliography style without URLs when DOI exists (in Overleaf with Zotero bibliography)

Image
2 2 I have a Zotero bibliography in Overleaf. I use biblatex . usepackage[backend=biber,citestyle=authoryear]{biblatex} addbibresource{zoteroALH.bib} Bibliography entries look like: @book{de_saint-gervais_uniformization_2016, title = {Uniformization of {Riemann} {Surfaces}}, isbn = {978-3-03719-145-3}, url = {https://www.ems-ph.org/books/book.php?proj_nr=198&srch=series%7Chem}, urldate = {2019-02-03}, author = {de Saint-Gervais, Paul Henri}, year = {2016}, doi = {10.4171/145} } In the bibliography down the paper the reference shows like this: There is the DOI, great, but also the URL which is unnecessary when the DOI is there. How can I remove the URL when the DOI is present? biblatex bibliographies overleaf zote
Read more

ComboBox Display Member on multiple fields

Image
2 I'm trying to set the .DisplayMember property of a ComboBox in C#, but I want to bind it to multiple columns in the .DataSouce . My SQL looks like this: SELECT PersNbr, PersFirstName, PersMiddleName, PersLastName FROM Pers WHERE PersNbr = :persNbr; I'm saving this query in a DataTable so each column selected has it's own column in the Datatable . I want to make the .DisplayMember a combination of PersFirstName + PersMiddleName + PersLastName so their full name appears like this: comboBox.DisplayMemeber = "PersFirstName" + "PersMiddleName" + "PersLastName" I know I can just to this on the query: SELECT PersNbr, (PersFirstName || PersMiddleName || PersLastName) PersName and then just do this: comboBox.DisplayMember = "PersName"; but I
Read more

Is it possible to collect Nectar points via Trainline?

Image
2 Since I am not eligible for any Railcard, the only available discount/bonus scheme is Nectar Card for me. GWR, SWR, LNER and Virgin Trains allow to collect Nectar points and I have already linked a card to my GWR account. A friend suggested me to use Trainline App, because it can search for bus tickets either. I had a look at the application, but could not see any option for Nectar. Is there a way to collect Nectar points when I buy tickets via Trainline? uk trains loyalty-programs trainline share | improve this question asked Dec 2 '18 at 15:50 ahmedus 3,224 5 19 49
Read more