Welcome Guest Search | Active Topics | Sign In | Register

Essential Objects Product Support Forum » All Products » Support » Issue with rendering SVG charts

Issue with rendering SVG charts Options
Previous Topic · Next Topic
Igor
Posted: Wednesday, April 29, 2015 12:31:58 PM
Rank: Newbie
Groups: Member

Joined: 4/29/2015
Posts: 1
I have a strange issue when converting HTML file with SVG charts - data labels displayed twice in the pdf

Please see example below - single label in HTML and double in PDF

<html>

<svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" style="font-family:'lucida grande', 'lucida sans unicode', arial, helvetica, sans-serif;font-size:12px;" xmlns="http://www.w3.org/2000/svg" width="600" height="400"><desc>Created with Highcharts 4.1.4</desc><defs><clipPath id="highcharts-113"><rect x="0" y="0" width="550" height="313"></rect></clipPath></defs><rect x="0" y="0" width="600" height="400" strokeWidth="0" fill="#FFFFFF" class=" highcharts-background"></rect><g class="highcharts-grid" ></g><g class="highcharts-grid" ><path fill="none" d="M 50 359.5 L 600 359.5" stroke="#D8D8D8" stroke-width="1" opacity="1"></path><path fill="none" d="M 50 296.5 L 600 296.5" stroke="#D8D8D8" stroke-width="1" opacity="1"></path><path fill="none" d="M 50 234.5 L 600 234.5" stroke="#D8D8D8" stroke-width="1" opacity="1"></path><path fill="none" d="M 50 171.5 L 600 171.5" stroke="#D8D8D8" stroke-width="1" opacity="1"></path><path fill="none" d="M 50 109.5 L 600 109.5" stroke="#D8D8D8" stroke-width="1" opacity="1"></path><path fill="none" d="M 50 45.5 L 600 45.5" stroke="#D8D8D8" stroke-width="1" opacity="1"></path></g><g class="highcharts-axis" ><path fill="none" d="M 600.5 359 L 600.5 369" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 49.5 359 L 49.5 369" stroke="#C0D0E0" stroke-width="1" opacity="1"></path><path fill="none" d="M 50 359.5 L 600 359.5" stroke="#C0D0E0" stroke-width="1" visibility="visible"></path></g><g class="highcharts-axis" ></g><g class="highcharts-series-group" ><g class="highcharts-series" visibility="visible" transform="translate(50,46) scale(1 1)" clip-path="url(#highcharts-113)"><rect x="132" y="115" width="66" height="199" fill="#7cb5ec" rx="0" ry="0"></rect></g><g class="highcharts-markers" visibility="visible" transform="translate(50,46) scale(1 1)" clip-path="none"></g><g class="highcharts-series" visibility="visible" transform="translate(50,46) scale(1 1)" clip-path="url(#highcharts-113)"><rect x="242" y="118" width="66" height="196" fill="#434348" rx="0" ry="0"></rect></g><g class="highcharts-markers" visibility="visible" transform="translate(50,46) scale(1 1)" clip-path="none"></g><g class="highcharts-series" visibility="visible" transform="translate(50,46) scale(1 1)" clip-path="url(#highcharts-113)"><rect x="352" y="128" width="66" height="186" fill="#90ed7d" rx="0" ry="0"></rect></g><g class="highcharts-markers" visibility="visible" transform="translate(50,46) scale(1 1)" clip-path="none"></g></g><text x="303" text-anchor="middle" class="highcharts-title" style="color:#333333;font-size:14px;fill:#333333;width:551px;" y="21"><tspan>Personal Property</tspan></text><g class="highcharts-data-labels" visibility="visible" transform="translate(50,46) scale(1 1)" opacity="1"><text x="167.59272486435069" y="115" r="0" padding="5" transform="translate(0,0) rotate(315 167.59272486435069 115)" style="color: rgb(0, 0, 0); font-size: 11px; font-weight: bold; fill: rgb(0, 0, 0); text-shadow: rgb(255, 255, 255) 0px 0px 6px, rgb(255, 255, 255) 0px 0px 3px;" text-anchor="start"><tspan>$ 63 472 000</tspan></text></g><g class="highcharts-data-labels" visibility="visible" transform="translate(50,46) scale(1 1)" opacity="1"><text x="277.59272486435066" y="118" r="0" padding="5" transform="translate(0,0) rotate(315 277.59272486435066 118)" style="color: rgb(0, 0, 0); font-size: 11px; font-weight: bold; fill: rgb(0, 0, 0); text-shadow: rgb(255, 255, 255) 0px 0px 6px, rgb(255, 255, 255) 0px 0px 3px;" text-anchor="start"><tspan>$ 62 563 000</tspan></text></g><g class="highcharts-data-labels" visibility="visible" transform="translate(50,46) scale(1 1)" opacity="1"><text x="387.59272486435066" y="128" r="0" padding="5" transform="translate(0,0) rotate(315 387.59272486435066 128)" style="color: rgb(0, 0, 0); font-size: 11px; font-weight: bold; fill: rgb(0, 0, 0); text-shadow: rgb(255, 255, 255) 0px 0px 6px, rgb(255, 255, 255) 0px 0px 3px;" text-anchor="start"><tspan>$ 59 301 000</tspan></text></g><g class="highcharts-legend" transform="translate(231,371)"><g ><g><g class="highcharts-legend-item" transform="translate(8,3)"><text x="21" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" y="15">1</text><rect x="0" y="4" width="16" height="12" fill="#7cb5ec"></rect></g><g class="highcharts-legend-item" transform="translate(56.828125,3)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" >2</text><rect x="0" y="4" width="16" height="12" fill="#434348"></rect></g><g class="highcharts-legend-item" transform="translate(105.65625,3)"><text x="21" y="15" style="color:#333333;font-size:12px;font-weight:bold;cursor:pointer;fill:#333333;" text-anchor="start" >3</text><rect x="0" y="4" width="16" height="12" fill="#90ed7d"></rect></g></g></g></g><g class="highcharts-axis-labels highcharts-xaxis-labels" ><text x="325" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:585px;text-overflow:clip;" text-anchor="middle" transform="translate(0,0)" y="378" opacity="1"></text></g><g class="highcharts-axis-labels highcharts-yaxis-labels" ><text x="35" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:188px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="362" opacity="1">0M</text><text x="35" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:188px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="299" opacity="1">20M</text><text x="35" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:188px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="236" opacity="1">40M</text><text x="35" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:188px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="174" opacity="1">60M</text><text x="35" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:188px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="111" opacity="1">80M</text><text x="35" style="color:#606060;cursor:default;font-size:11px;fill:#606060;width:188px;text-overflow:clip;" text-anchor="end" transform="translate(0,0)" y="49" opacity="1">100M</text></g><g class="highcharts-tooltip" style="cursor:default;padding:0;white-space:nowrap;" transform="translate(0,-9999)"><path fill="none" d="M 3 0 L 13 0 C 16 0 16 0 16 3 L 16 13 C 16 16 16 16 13 16 L 3 16 C 0 16 0 16 0 13 L 0 3 C 0 0 0 0 3 0" stroke="black" stroke-opacity="0.049999999999999996" stroke-width="5" transform="translate(1, 1)"></path><path fill="none" d="M 3 0 L 13 0 C 16 0 16 0 16 3 L 16 13 C 16 16 16 16 13 16 L 3 16 C 0 16 0 16 0 13 L 0 3 C 0 0 0 0 3 0" stroke="black" stroke-opacity="0.09999999999999999" stroke-width="3" transform="translate(1, 1)"></path><path fill="none" d="M 3 0 L 13 0 C 16 0 16 0 16 3 L 16 13 C 16 16 16 16 13 16 L 3 16 C 0 16 0 16 0 13 L 0 3 C 0 0 0 0 3 0" stroke="black" stroke-opacity="0.15" stroke-width="1" transform="translate(1, 1)"></path><path fill="rgb(249, 249, 249)" fill-opacity=" .85" d="M 3 0 L 13 0 C 16 0 16 0 16 3 L 16 13 C 16 16 16 16 13 16 L 3 16 C 0 16 0 16 0 13 L 0 3 C 0 0 0 0 3 0"></path><text x="8" style="font-size:12px;color:#333333;fill:#333333;" transform="translate(0,20)"></text></g></svg>

</html>
Back to top
 
eo_support
Posted: Thursday, April 30, 2015 10:41:36 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,196
Hi,

Please try to remove the text shadow in your SVG:

text-shadow: rgb(255, 255, 255) 0px 0px 6px, rgb(255, 255, 255) 0px 0px 3px;

Currently our converter can not handle text shadow with scale correctly. So if you remove the shadow, it will work correctly.

We will work on our side to see if we can correct this problem too.

Thanks!
Back to top
 


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.