Showing multiline text using d3.js

[Jaspreet Singh]

I was using div  to append text like in below example:

 

http://bl.ocks.org/JohnDelacour/5676636

 

But it's not working for me.

 

Here is my Script in Jsfiddle.

 

http://jsfiddle.net/gTA6H/2/

 

Here what it's doing.

 

Basically there are some circles in it. On Click of Circles i am showing person's data in Rectangle. As details can be more than one line,

 

Earlier i was appending .text to g element as you will see code in jffiddle, now i am trying same thing with div but it's not working.

 

Can you please help.

 

Thanks.

[Christophe Viau]

Cross-post from
http://stackoverflow.com/questions/17675654/showing-multiline-text-using-d3-js
Chris

> --
> You received this message because you are subscribed to the Google
> Groups "d3-js" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to d3-js+un...@googlegroups.com.
> For more options, visit https://groups.google.com/groups/opt_out.
>
>

[Jaspreet Singh]

Hi Chris, yes , but the Solution proposed is using Foreign Objects which does not show up in IE9. Can you suggest some other solution that works for IE 9 too.?

 

Thanks.

[Christophe Viau]

The example you based your test on is using a div separated from the svg, so it will work on IE9. Another partial solution is to split your text yourself (i.e. by an arbitrary number of characters) and use svg tspan.
Chris

On 7/16/13 5:13 PM, Jaspreet Singh wrote:

Hi Chris, yes , but the Solution proposed is using Foreign Objects which does not show up in IE9. Can you suggest some other solution that works for IE 9 too.?

 

Thanks.