Home >Backend Development >PHP Problem >How to convert svg to png format in php

How to convert svg to png format in php

青灯夜游
青灯夜游Original
2021-05-21 15:25:004334browse

php method to convert svg to png format: 1. Install the php imagick extension plug-in and use the built-in function in the plug-in to convert. 2. First convert the svg image into a canvas image; then convert the canvas image into a png format image.

How to convert svg to png format in php

The operating environment of this tutorial: windows7 system, PHP7.1 version, DELL G3 computer

svg to png implementation

1.php imagick extension plug-in

a. Study the imagick plug-in method

$im = new Imagick($upload_path . $file_name);
$svg = file_get_contents($upload_path . $file_name);
$svg = &#39;<?xml version="1.0" encoding="UTF-8" standalone="no"?>&#39;.$svg;
$im->readImageBlob($svg);
// png settings
$im->setImageFormat("png24");
$srcImage = $im->getImageGeometry(); //获取源图片宽和高
$im->resizeImage($srcImage[&#39;width&#39;], $srcImage[&#39;height&#39;], imagick::FILTER_LANCZOS, 1, false);
$im->writeImage($upload_path.&#39;/&#39;.$topng_name.&#39;.png&#39;);
$im->clear();
$im->destroy();

b. Problems encountered

svg pictures can be successfully converted into png format pictures, but png pictures There are problems:

1) Line segments are missing;

2) Fonts are not displayed;

3) The style tag style in the svg file cannot be parsed;

2 .Abandon the imagick plug-in and change it to svg to canvas to png

a.svg to canvas

function drawInlineSVG($svg, callback) {
  var svg = $svg;
  var parser = new DOMParser();
  var doc = parser.parseFromString(svg, "text/xml");
  svg = doc.getElementsByTagName(&#39;svg&#39;);
  svg = svg[0];
  svg.innerHTML = &#39;<rect width="100%" height="100%" fill="#ffffff"></rect>&#39; + svg.innerHTML;
  var svgData = new XMLSerializer().serializeToString( svg );
  var img = document.createElement( "img" );
  img.setAttribute( "src", "data:image/svg+xml;base64," + btoa( unescape(encodeURIComponent(svgData)) ) );
  img.onload = function () {
    var canvas = document.createElement( "canvas" );
    canvas.width = img.width;
    canvas.height = img.height;
    var ctx = canvas.getContext( "2d" ); //取得画布的2d绘图上下文
    ctx.drawImage( img, 0, 0 );
    canvas.toDataURL( "image/png" );
    var base64Src = canvas.toDataURL( "image/png" );
    callback && callback(base64Src); // 调用回掉函数
  };
 return;
}

b.canvas to png (base64Src converted to png)

/* base64格式编码转换为图片并保存对应文件夹 */
function base64_image_content($base64_image_content,$path, $file_name = &#39;&#39;){
  //匹配出图片的格式
  if (preg_match(&#39;/^(data:\s*image\/(\w+);base64,)/&#39;, $base64_image_content, $result)){
    if(!file_exists($path)){
      // 路径不存在
     return false;
    }
    $new_file = $path . $file_name;
    if (file_put_contents($new_file, base64_decode(str_replace($result[1], &#39;&#39;, $base64_image_content)))){
      return &#39;/&#39;.$new_file;
    }else{
      return false;
    }
  }else{
    return false;
  }
}

c .Effect examples

1) svg format

How to convert svg to png format in php

2) png format

How to convert svg to png format in php

Recommended learning: "PHP Video Tutorial"

The above is the detailed content of How to convert svg to png format in php. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn