|
Rank: Member Groups: Member
Joined: 3/25/2014 Posts: 11
|
Hi, We're trying out EO.Pdf and love it so far. One issue we've run into is that some SVG elements in maps (as used in leaflet.js) appear offset in the generated PDF. To see the problem in action, try the following: Use the example London map with the big red circle here: http://leafletjs.com/examples/quick-start.htmlPaste that url into the EO UrlToPdf "try it" page: http://www.essentialobjects.com/Products/EOPdf/UrlToPdf.aspxYou'll see that the big red circle in the pdf is offset from the original map. Thanks for you help, Ryan
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,196
|
Hi,
This is just to let you know that we are still working on this issue. We are able to reproduce the problem here, but we have not found out the root cause yet. I apologize for the delay and we will post again as soon as we have an update.
Thanks!
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,196
|
Hi, Please add the following code BEFORE include leaflet's JavaScript file:
Code: JavaScript
//Disable 3D support only if the page is running inside EO.Pdf
if (typeof(eopdf) != "undefined")
window.L_DISABLE_3D = true;
Note that it is very important that this code appears before leaflet's JavaScript. For example, it can be like this:
Code: HTML/ASPX
<!-- Disable 3D rendering if page runs inside EO.Pdf -->
<script>
if (typeof(eopdf) != "undefined")
window.L_DISABLE_3D = true;
</script>
<!-- Leaflet's main JS file -->
<script src="leaflet.js"></script>
After this the circles should work fine on the map. The reason is leaflet automatically uses translate3d transform for 2d translate transform on WebKit based browser (EO.Pdf is based on WebKit). It is not necessary to use translate3d since the transform is actually 2d (an X offset and a Y offset). The comment in leaflet's code indicates that using the 3d version will trigger hardware acceleration thus making rendering faster and smoother, which does make senses since all major browsers use GPU to do 3d transform for screen output. However it appears that EO.Pdf has problem supporting 3d transforms since we do not render to the screen. Fortunately leaflet has a flag L_DISABLE_3D that allows you to disable using 3d transforms. As such setting that flag should avoid the issue with EO.Pdf. The code also detects whether variable "eopdf" is defined so that it only disables 3d when the page runs inside EO.Pdf. Hope this helps and we apologize for the delay. Please give it a try and let us know if it works for you. Thanks!
|
|
Rank: Member Groups: Member
Joined: 3/25/2014 Posts: 11
|
Yes, this works for us!
Thanks, Ryan
|
|
Rank: Administration Groups: Administration
Joined: 5/27/2007 Posts: 24,196
|
Great! Glad to hear that it works for you!
|
|