使用Fabric.js在SVG上无法正确渲染SVG [英] SVG is not rendering properly on canvas with Fabric.js

问题描述

我使用 fabric.loadSVGFromURL 函数将SVG图像加载到画布。
大多数图像在画布上正确加载，但是有一些SVG图像在画布上没有正确加载（一半的SVG加载为黑色SVG）。

I have used fabric.loadSVGFromURL function for loading SVG image to canvas. Most of the images are loading correctly on the canvas but there are some SVG images which are not loading properly on the canvas (half of the SVG is loading as black colored SVG).

以下SVG未在画布上正确加载：

Following SVG is not loaded properly on canvas:

http://dev9.edisbest.com/Bat_B_020.svg

以下是我使用的代码：

    var src ="http://dev9.edisbest.com/Bat_B_020.svg";
        fabric.loadSVGFromURL(src, function (objects, options) { 
        var shape = fabric.util.groupSVGElements(objects, options);
        shape.set({
                          left: canvas.width/2,
                        top: canvas.height/2,
                        scaleY: canvas.height / (shape.height*3),
                        scaleX: canvas.width /(shape.width*3)

                      });
                      shape.setCoords();
        canvas.add(shape);
                      canvas.setActiveObject(shape);
                      canvas.renderAll();
});

在屏幕上加载SVG时拍摄的截图;在那里我得到了不需要的黑色，实际上不在SVG中。

this screenshot taken when above SVG loaded on canvas; there I got unwanted black color which actually not in the SVG.

推荐答案

这个问题由Kangax解决。

this issue is solved by Kangax.

请查看以下链接：

https://github.com/kangax/fabric.js/issues/1021

非常感谢Kangax ....！

thanks you so much Kangax....!

这篇关于使用Fabric.js在SVG上无法正确渲染SVG的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！