Canvg - SVG переполнение при использовании масштаба - PullRequest
Новая
       25

Canvg - SVG переполнение при использовании масштаба

0 голосов
/ 22 марта 2019

Проверьте этот пример здесь: https://jsfiddle.net/znbptw0c/

Этот SVG извлечен из библиотеки amCharts.

Но когда я изменяю его на изображение холста, используя canvg и transform : scale в SVG, оно обрезает уменьшенную часть, как я могу это исправить?

Я использую масштаб, потому что мне нужно увеличить разрешение, а не только размер.

Непосредственное изменение ширины / высоты SVG не было бы идеальным, поскольку это могло бы испортить некоторые выравнивания в более широком контексте, и я хочу, чтобы размер шрифта также увеличился.

JS: 

function svgToCanvas(svg){
  const canvas = document.createElement('canvas');
  svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
  svg.setAttribute('xmlns:xlink', 'http://www.w3.org/1999/xlink')
  canvg(canvas, svg.outerHTML);
  window.open(canvas.toDataURL("image/png",1.0))
  return canvas;
}
const svg = document.body.querySelector('svg');
svgToCanvas(svg)

HTML (слишком большой, пожалуйста, проверьте скрипку): 

<svg version="1.1" style="position: absolute; width: 1366px; height: 693px; top: 0px; left: 0px;transform: scale(1.5);" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
...
</svg>
...