当前位置:首页 > PHP教程 > php高级应用 > 列表

php 实现svg转化png格式的方法分析

发布:smiling 来源: PHP粉丝网  添加日期:2022-02-03 20:44:20 浏览: 评论:0 

这篇文章主要介绍了php 实现svg转化png格式的方法,结合实例形式分析了php svg转化png格式相关实现技巧、遇到的问题与操作注意事项,需要的朋友可以参考下。

本文实例讲述了php 实现svg转化png格式的方法,分享给大家供大家参考,具体如下:

svg转png实现

1.php imagick扩展插件

a.研究imagick插件方法

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

b.遇到的问题

svg图片可以成功转化为png格式图片,但png图片存在问题:

1)线段丢失;

2)字体不展示;

3)svg文件中style标签样式不能解析;

2.弃用imagick插件,改为svg转canvas转png

a.svg转canvas

  1. function drawInlineSVG($svg, callback) { 
  2.   var svg = $svg
  3.   var parser = new DOMParser(); 
  4.   var doc = parser.parseFromString(svg, "text/xml"); 
  5.   svg = doc.getElementsByTagName('svg'); 
  6.   svg = svg[0]; 
  7.   svg.innerHTML = '<rect width="100%" height="100%" fill="#ffffff"></rect>' + svg.innerHTML; 
  8.   var svgData = new XMLSerializer().serializeToString( svg ); 
  9.   var img = document.createElement( "img" ); 
  10.   img.setAttribute( "src""data:image/svg+xml;base64," + btoa( unescape(encodeURIComponent(svgData)) ) ); 
  11.   img.onload = function () { 
  12.     var canvas = document.createElement( "canvas" ); 
  13.     canvas.width = img.width; 
  14.     canvas.height = img.height; 
  15.     var ctx = canvas.getContext( "2d" ); //取得画布的2d绘图上下文 
  16.     ctx.drawImage( img, 0, 0 ); 
  17.     canvas.toDataURL( "image/png" ); 
  18.     var base64Src = canvas.toDataURL( "image/png" ); 
  19.     callback && callback(base64Src); // 调用回掉函数 
  20.   }; 
  21.  return

b.canvas转png(base64Src转化为png)

  1. /* base64格式编码转换为图片并保存对应文件夹 */ 
  2. function base64_image_content($base64_image_content,$path$file_name = ''){ 
  3.   //匹配出图片的格式 
  4.   if (preg_match('/^(data:\s*image\/(\w+);base64,)/'$base64_image_content$result)){ 
  5.     if(!file_exists($path)){ 
  6.       // 路径不存在 
  7.      return false; 
  8.     } 
  9.     $new_file = $path . $file_name
  10.     if (file_put_contents($new_filebase64_decode(str_replace($result[1], ''$base64_image_content)))){ 
  11.       return '/'.$new_file
  12.     }else
  13.       return false; 
  14.     } 
  15.   }else
  16.     return false; 
  17.   } 

c.效果示例

1)svg格式

svg转化png

2)png格式

svg转化png

Tags: svg转化png

分享到: