seliopou / elm-d3

Elm bindings for D3.js
Other
335 stars 36 forks source link

foreignObject support for html #22

Open flip111 opened 9 years ago

flip111 commented 9 years ago

It would be nice to allow html in the svg using foreignObject. You can see an example here https://gist.github.com/mbostock/1424037 I'm not sure how the elm-html lib could be pulled into this .. along with event handlers and everything else. Background: trying to display small forms alongside some d3 objects..

seliopou commented 9 years ago

foreignObject is supported right out of the box. elm-d3 lets you manipulate the DOM directly and use any features that it supports. I added an example in the foreignObject branch that's linked to this issue so you can see it in action. Directly translation of the JavaScript example you provided.

flip111 commented 9 years ago

Sorry maybe i haven't made my question clear enough. It was about how to use elm-html and event handlers to create the html rather than a string. Since it mentions in the readme that elm-d3 provides "an alternative renderer" so it might be hard to mix that with the elm-html renderer?

seliopou commented 9 years ago

Ah, I see what you're saying. Probably possible but would take a bit of work. Me and @drup have been contemplating a similar thing for the OCaml bindings. It's much more straightforward in OCaml/js_of_ocaml because the JavaScript interface pretty well-defined and low-level.

Anyways, I know this isn't what you're talking about but just to be clear, you can create HTML using elm-d3, even within SVG documents. Here's a modified example that does that.

flip111 commented 9 years ago

I'm new to both d3 and elm i don't think i know enough right now to do the integration of the renderers. Which puts me on a crossroads. Develop everything in D3 and later port the entire thing to elm (when integrated with elm-html). Or start developing in elm and wait with this feature until it's possible in elm. It's quite essential to have this for my project. Can you advice in the choice between those two? I think it's depending on how hard it actually would be (that bit of work) and if there is any chance it will make it into the library.

seliopou commented 9 years ago

I'm not sure what to tell you. It seems that you have to make some tradeoffs and you're probably in a better position than anybody else to decide what to do. I may get to embedding arbitrary Elements into elm-d3 soon, or it may be a while.

But to be clear, you can use elm-d3 to manipulate HTML. In fact, you can use it to manipulate any DOM you want to. See the TodoMVC example to see how that works.