Noob trying to figure out the export functions

[trosenthaltaconic]

I'm trying to figure out how to add a watermark/logo on my exported files but I can't get the JSON file to validate. I know I'm missing something stupid like a coma but I don't know where.

I've add the beforecapture to my export but again it just keeps saying there is something wrong.

export-beforecapture.txt

[maertz]

Looks fine to me, just ensure the image you are going to embed comes from the same origin (http://info.taconic.com/) as your chart otherwise it violates the cross resource origin security policy (CORS)

[trosenthaltaconic]

Well I tried using base64 string such as"data:image/png;base64,77+977+9ae+/ve+/ve+/vX7vv71acu+/ve+/vXHvv70m77+9G++/vX7vv73image77+977+9aO+/ve+/vT/vv73vv70o77+9Jyzvv73vv70kee+/vWjvv73vv71n" but that doesn't work either

[maertz]

Your base64 string does not seem to be a valid data url, please take a look to this sample.

fyi: I used that site to convert your image to base64.

[trosenthaltaconic]

I figured out part of the issue and the image is now rendering. Now I just need to understand the scaleX and scaleY numbering to figure out how to size the image properly.

[maertz]

I've updated the sample, it places your image into the center of the canvas (plotarea).

The scale (scaleX, scaleY) defines the image size in a percentage-ish value from 0-1. The origin (originX, originY) sets the anchor point where the image will be dragged from.

You might want to take a look into the official fabricJS docs page which explains the setOverlayImage method in a deeper detail.

[trosenthaltaconic]

Gotcha - I was just reviewing that. How come when I use originX: 'right', and originY: 'bottom' the image never shows up but when I use left and top it works?

[maertz]

Most likely you are outside the canvas. If you drag the image origin point from the center to the right bottom, you need to cancel the offset through the top, left property, in this case by 250px (your image is 500x500px) to drag it back to the center point.

Initial sample: top,left and origin at the center (no offset needed): http://codepen.io/team/amcharts/pen/df25fb675a38482c510c1ce353a91c9a?editors=0010

Origin right bottom sample: top, left with an additional 250px (half image size) to cancel the offset: http://codepen.io/team/amcharts/pen/3f228704a333c4a8361fa318fc0af46a?editors=0010

[satinder1208]

Hi trosenthaltaconic,

How you sorted the issue of base64 format. I am stuck in a problem with data:image/jpeg;base64,77+977+977+977+9AB...

Thanks in advance

[trosenthaltaconic]

Yes, I've using this without issues for about a month. https://www.base64-image.de/ has been a huge help.