improve ellipsis logic about d3plus-text HOT 8 CLOSED

   var data = [{text: 'Pellentesque habitant morbi tristiqu'}]
    new d3plus.TextBox()
      .data(data)
      .fontSize(17)
      .width(50)
      .render();

I got the d3plus-text.full.js:3174 Uncaught TypeError: Cannot read property 'replace' of undefined,
further testing shows that sometimes the text element doesn't render at all, sometimes throw errors. I tried adjusting fontsize, width, height, and overflow options. The behavior is unpredictable.

from d3plus-text.

Good find. I've pushed a fix.

The reason text sometimes does not render, as in your case, is because the first word of your sentence cannot fit given the specified fontSize and width.

from d3plus-text.

@davelandry , thanks for the fix! Now I can confirm the error is gone, but I still see it renders nothing, when it is supposed to render ellipsis, in case of there is no enough room for rendering text in a single line.

from d3plus-text.

You're right, it should render an ellipsis in this case. I'll push that fix as well.

from d3plus-text.

@geohuz just pushed some tweaks to the logic, what do you think?

from d3plus-text.

Yeah! it works now!

from d3plus-text.

I got another issue with the long text rendering, and suspected that's related to this ticket, the rendering text is: "建立客户信息反馈机制，跟踪解决过程，问题解决率达到80%以上", throwing the following error:

d3plus-text.js:210 Uncaught TypeError: Cannot read property 'trimRight' of undefined

I'm using the version 0.9.8

from d3plus-text.

That string is rendering an ellipsis for me, and not throwing any errors. Can you please post your full TextBox config or a jsfiddle?

from d3plus-text.