Combining DrawPane with FacetChart into one image

[senordhuff]

Hi there,

I'm trying to figure out how to merge a DrawPane with a FacetChart so they can be exported together as one svg image. Right now, I'm laying them out next to each other. But, how can I make them one image? Is there a way to insert the DrawPane on the right into the FacetChart without blocking the chart data? Or, insert both the DrawPane and the FacetChart into a parent DrawPane? I played around with some ways to do this and couldn't figure it out easily. See attached example.

[Isomorphic]

You should be able to use a standard widget (a Layout, say) to put them side by side on your page and then use RPCManager.exportContent() API.

As an aside, you could also add DrawItems to a FacetChart [a subclass of DrawPane], using the chartDrawn() / chartBackgroundDrawn() type notifications but this is going to be a much trickier approach to get right for the kind of appearance you're after

Regards
Isomorphic Software

[senordhuff]

We are actually not using exportContent. We have our own server-side processing when we want to export charts. And, we are trying to export the chart and associated drawing pane as one image in order to embed that image into the body of emails. So, we are looking for some way to merge the two into one image. Is there a way to do this client-side before sending to the server? Or, a server-side API that would help?

[Isomorphic]

This would have to be done on the server.

On the back end the com.isomorphic.contentexport.PdfExport class should allow you to convert from HTML to pdf.
On the client, you can use 'getPrintHTML' on a Canvas to get the HTML for conversion -- this is basically what exportContent does.

To actually send the request to the client, you could use DMI or a custom dataSource request, or a custom RPCRequest sent via RPCManager.sendRequest().

[senordhuff]

Actually, we've already got the PDF part working. The part where we are stuck is creating a PNG so we can display those contents in the body of an email. It looks like your ImageExport.getPNG() method will only accept an SVG string. So, I'm trying to figure out how to create a single SVG string that will work with ImageExport.getPNG() based on the combination of the FacetChart and the DrawPane I attached. Does that make sense and do you have a suggestion on how to do it?

[Isomorphic]

A brute force approach would be to get a PNG from each of the FacetChart and DrawPane, the place both as DrawImages inside a new DrawPane, and ask that for a PNG.

Or perhaps you could just have 2 png's side-by-side in your email?