I've added a quickstart. https://issues.apache.org/jira/browse/WICKET-6424
Per
> Gesendet: Dienstag, 18. Juli 2017 um 08:16 Uhr
> Von: "Per Newgro" <per.new...@gmx.ch>
> An: users@wicket.apache.org
> Betreff: Aw: Re: Re: Use Resource to transfer SVG to PNG
>
> My main problem is, that i can not send the svg text to the resource. Doing
> so by request parameters is not an option because the firewall will deny that
> long cryptic content.
> Therefor i would like to send the svg content through a form.
>
> So far i have the following:
>
> In my page-markup (containing the svg) i have
>
> <form method="POST" wicket:id="svgForm" onSubmit="getSvg(this)">
> <input type="hidden" value="" wicket:id="svg-data" name="data" />
> <input id="chart-export" type="submit" class="button secondary"
> wicket:message="value:misc.chartExport" />
> </form>
>
> <script type="text/javascript">
> var getSvg = function(element) {
> var svgHtml = document.querySelector('#chart-container
> .highcharts-container').innerHTML;
> element.querySelector('input[name="data"]').value = svgHtml;
> }
> </script>
>
>
> In my page i have
>
> add(
> new WebMarkupContainer("svgForm")
> .add(AttributeModifier.replace("action",
> PngResourceReference.url().toString())));
>
>
> I've registered a resource by reference
>
> app.mountResource("/svg2png", new PngResourceReference());
>
> -----------
>
> public class PngResourceReference extends ResourceReference {
>
> private static final Key KEY = new
> Key(PngResourceReference.class.getName(), "svg-to-png", null, null, null);
>
> public PngResourceReference() {
> super(KEY);
> }
>
> @Override
> public IResource getResource() {
> return new PngResource();
> }
>
> public static CharSequence url() {
> PageParameters svgParameters = new PageParameters();
> return
> RequestCycle.get().urlFor(Application.get().getResourceReferenceRegistry().getResourceReference(KEY,
> false, false), svgParameters);
> }
> }
>
> public class PngResource extends ByteArrayResource {
>
> public PngResource() {
> super("image/png");
> }
>
> @Override
> protected void configureResponse(ResourceResponse response, Attributes
> attributes) {
> super.configureResponse(response, attributes);
> response.setContentDisposition(ContentDisposition.ATTACHMENT);
> response.setFileName("chart.png");
> response.disableCaching();
> }
>
> @Override
> protected byte[] getData(Attributes attributes) {
> ByteArrayOutputStream os;
> try {
> PNGTranscoder t = new PNGTranscoder();
>
> // Set the transcoder input and output.
> String svg = "something";
> TranscoderInput input = new TranscoderInput(new
> StringReader(svg));
> os = new ByteArrayOutputStream();
> TranscoderOutput output = new TranscoderOutput(os);
>
> // Perform the transcoding.
> t.transcode(input, output);
> os.close();
> } catch (TranscoderException | IOException e) {
> throw new RuntimeException(e);
> }
> return os.toByteArray();
> }
> }
>
> > Gesendet: Montag, 17. Juli 2017 um 15:30 Uhr
> > Von: "Martin Grigorov" <mgrigo...@apache.org>
> > An: "users@wicket.apache.org" <users@wicket.apache.org>
> > Betreff: Re: Re: Use Resource to transfer SVG to PNG
> >
> > On Mon, Jul 17, 2017 at 3:13 PM, Per Newgro <per.new...@gmx.ch> wrote:
> >
> > > Thanks for your response Martin.
> > >
> > > I tried to make it work the whole day now. But i can not get it to work
> > > with IE11.
> > > There is always a security error. This is a known problem for IE and
> > > canvas.
> > >
> > > I ended up:
> > >
> > > $("#chart-export").on("click", function() {
> > > var svg = document.querySelector( "svg" );
> > > var svgData = new XMLSerializer().serializeToString( svg );
> > >
> > > var canvas = document.createElement( "canvas" );
> > > document.body.appendChild(canvas);
> > > var svgSize = svg.getBoundingClientRect();
> > > canvas.width = svgSize.width;
> > > canvas.height = svgSize.height;
> > >
> > > var ctx = canvas.getContext( "2d" );
> > > ctx.clearRect(0, 0, canvas.width, canvas.height);
> > >
> > > var img = document.createElement("img");
> > > img.setAttribute("crossOrigin", "anonymous");
> > > img.onload = function() {
> > > ctx.drawImage( img, 0, 0 );
> > > var a = document.createElement("a");
> > > a.download = "chart.png";
> > > a.href = canvas.toDataURL( "image/png" );
> > > document.body.appendChild(a);
> > > a.click();
> > > };
> > > img.setAttribute("src", "data:image/svg+xml;base64," +
> > > btoa(unescape(encodeURIComponent(svgData)))
> > > );
> > > });
> > >
> > > So i need to go on the other way. But there my problems still occur.
> > >
> >
> > What exactly are the problems ?
> > It is not very clear from your first email.
> >
> >
> > >
> > > Regards
> > > Per
> > >
> > > > Gesendet: Montag, 17. Juli 2017 um 10:42 Uhr
> > > > Von: "Martin Grigorov" <mgrigo...@apache.org>
> > > > An: "users@wicket.apache.org" <users@wicket.apache.org>
> > > > Betreff: Re: Use Resource to transfer SVG to PNG
> > > >
> > > > Hi,
> > > >
> > > > Wouldn't HTML Canvas API be better solution?
> > > > See https://stackoverflow.com/a/27232525/497381
> > > >
> > > >
> > > > Martin Grigorov
> > > > Wicket Training and Consulting
> > > > https://twitter.com/mtgrigorov
> > > >
> > > > On Mon, Jul 17, 2017 at 10:12 AM, Per Newgro <per.new...@gmx.ch> wrote:
> > > >
> > > > > Hello *,
> > > > >
> > > > > I would like to generate a png from a svg. The transcoding is done by
> > > > > using Batik.
> > > > > So far it works as expected.
> > > > >
> > > > > But i'm not sure how to provide the resulting png (a byte[]) to my
> > > > > frontend.
> > > > >
> > > > > The svg is generate in browser by using highcharts. I would like to
> > > > > provide a button
> > > > > that downloads the transcoded png by sending a request to the
> > > "transcoding
> > > > > resource"
> > > > > and using the svg-dom from browser.
> > > > >
> > > > > Is there someone who did that already once? Can you please give me a
> > > hint
> > > > > how this could work?
> > > > >
> > > > > Thanks for your support
> > > > > Per
> > > > >
> > > > > ---------------------------------------------------------------------
> > > > > To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> > > > > For additional commands, e-mail: users-h...@wicket.apache.org
> > > > >
> > > > >
> > > >
> > >
> > > ---------------------------------------------------------------------
> > > To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> > > For additional commands, e-mail: users-h...@wicket.apache.org
> > >
> > >
> >
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> For additional commands, e-mail: users-h...@wicket.apache.org
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org
