Forum Bugs

SVG conversion has incorrect boundaries

jaredculp
Input SVG:

<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" class="highcharts-root" style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Arial, Helvetica, sans-serif;font-size:12px;" xmlns="http://www.w3.org/2000/svg" width="270" height="286"><desc>Created with Highcharts 9.1.0</desc><defs><clipPath id="highcharts-l2fn4bq-9-"><rect x="0" y="0" width="270" height="217" fill="none"></rect></clipPath><clipPath id="highcharts-l2fn4bq-13-"><rect x="0" y="10" width="270" height="217" fill="none"></rect></clipPath></defs><rect fill="none" class="highcharts-background" x="0" y="0" width="270" height="286" rx="0" ry="0"></rect><rect fill="none" class="highcharts-plot-background" x="0" y="10" width="270" height="217"></rect><g class="highcharts-pane-group" data-z-index="0"></g><g class="highcharts-grid highcharts-xaxis-grid" data-z-index="1"><path fill="none" stroke-dasharray="none" data-z-index="1" class="highcharts-grid-line" d="M 134.5 10 L 134.5 227" opacity="1"></path><path fill="none" stroke-dasharray="none" data-z-index="1" class="highcharts-grid-line" d="M 269.5 10 L 269.5 227" opacity="1"></path><path fill="none" stroke-dasharray="none" data-z-index="1" class="highcharts-grid-line" d="M -0.5 10 L -0.5 227" opacity="1"></path></g><rect fill="none" class="highcharts-plot-border" data-z-index="1" x="0" y="10" width="270" height="217"></rect><g class="highcharts-axis highcharts-xaxis" data-z-index="2"><path fill="none" class="highcharts-axis-line" data-z-index="7" d="M 0 227 L 270 227"></path></g><g class="highcharts-series-group" data-z-index="3"><g class="highcharts-series highcharts-series-0 highcharts-column-series" data-z-index="0.1" opacity="1" transform="translate(0,10) scale(1 1)"><path fill="cmyk(.65, .4, 0, .05)" d="M 20 150 L 116 150 C 119 150 122 153 122 156 L 122 218 C 122 218 122 218 122 218 L 14 218 C 14 218 14 218 14 218 L 14 156 C 14 153 17 150 20 150 Z" opacity="1" class="highcharts-point highcharts-color-0"></path><path fill="cmyk(.5, 0, 1, .05)" d="M 155 29 L 251 29 C 254 29 257 32 257 35 L 257 218 C 257 218 257 218 257 218 L 149 218 C 149 218 149 218 149 218 L 149 35 C 149 32 152 29 155 29 Z" opacity="1" class="highcharts-point highcharts-color-1"></path></g><g class="highcharts-markers highcharts-series-0 highcharts-column-series" data-z-index="0.1" opacity="1" transform="translate(0,10) scale(1 1)"></g></g><text x="135" text-anchor="middle" class="highcharts-title" data-z-index="4" style="color:#333333;font-size:18px;fill:#333333;" y="24"></text><text x="135" text-anchor="middle" class="highcharts-subtitle" data-z-index="4" style="color:#666666;fill:#666666;" y="24"></text><text x="0" text-anchor="start" class="highcharts-caption" data-z-index="4" style="color:#666666;fill:#666666;" y="283"></text><g class="highcharts-data-labels highcharts-series-0 highcharts-column-series" data-z-index="6" opacity="1" transform="translate(0,10) scale(1 1)"><g class="highcharts-label highcharts-data-label highcharts-data-label-color-0" data-z-index="1" transform="translate(30,116)"><text x="10" data-z-index="1" y="23.984375" style="color:#000000;font-family:Helvetica;font-size:14px;font-weight:normal;line-height:22px;fill:#000000;"><tspan class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round" style="">180 kWh<tspan x="10" y="23.984375">​</tspan></tspan>180 kWh</text></g><g class="highcharts-label highcharts-data-label highcharts-data-label-color-1" data-z-index="1" transform="translate(165,-5)"><text x="10" data-z-index="1" y="23.984375" style="color:#000000;font-family:Helvetica;font-size:14px;font-weight:normal;line-height:22px;fill:#000000;"><tspan class="highcharts-text-outline" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2px" stroke-linejoin="round">500 kWh<tspan x="10" y="23.984375">​</tspan></tspan>500 kWh</text></g></g><g class="highcharts-axis-labels highcharts-xaxis-labels" data-z-index="7"><text x="67.5" style="color:#000000;cursor:default;font-size:14px;text-align:center;font-family:Helvetica;line-height:22px;fill:#000000;" text-anchor="middle" transform="translate(0,0)" y="249" opacity="1">You</text><text x="202.5" style="color:#000000;cursor:default;font-size:14px;text-align:center;font-family:Helvetica;line-height:22px;fill:#000000;" text-anchor="middle" transform="translate(0,0)" y="249" opacity="1">Homes in the<tspan dy="22" x="202.5">​</tspan>Efficiency Zone</text></g><g class="highcharts-control-points" data-z-index="99" clip-path="url(#highcharts-l2fn4bq-13-)"></g></svg>


Command:
prince chart.svg


In the browser it looks fine, but when I convert to pdf using prince the text is no longer wrapping and in the wrong places.

  1. chart.pdf10.0 kB
  2. chart.svg4.7 kB

Edited by jaredculp

mikeday
Thank you we will investigate this issue.
wangp
Prince incorrectly strips Zero Width Space characters (U+200B) from SVG text. We'll fix this in the next latest build.
mikeday
We have now released an updated latest build of Prince which does not incorrectly strip zero-width space characters from SVG text. Thanks for letting us know about this issue! :D