FabricJS将SVG导入画布而不渲染答案

【问题标题】：FabricJS Import SVG into canvas not renderingFabricJS将SVG导入画布而不渲染
【发布时间】：2017-06-16 03:23:54
【问题描述】：

我正在尝试使用 fabricJS。我在将 SVG 文件导入画布时卡住了。我在fabricjs站点中看到了示例，并使用了SO答案中建议的代码。导入的图像未在画布中呈现，如下面的小提琴所示。

我错过了什么吗？

我尝试过的其他代码

var group = [];

fabric.loadSVGFromURL($(this).attr("src"),function(objects,options) {
    var loadedObjects = new fabric.Group(group);
    loadedObjects.set({
        width: 200,
        height: 200
    });
    canvas.centerObject(loadedObjects);
    canvas.add(loadedObjects);
    canvas.renderAll();
},function(item, object) {
    object.set('id',item.getAttribute('id'));
    group.push(object);
});

【问题讨论】：

问题仅出在 ssl 上。您正在尝试通过安全页面（https 上的 js fiddle）加载非安全内容（来自 http 的 svg 图像）。试试这个链接 - jsfiddle.net/d6p80yuk
ranjana 你能把这个作为答案发布吗
我在本地系统的 apache 端口 80 上测试这个，它使用 http。我只是复制粘贴的代码。

标签： javascript canvas svg fabricjs

【解决方案1】：

在浏览了 Chrome 错误日志后，我发现一条错误消息说混合请求已加载。如果您像我一样使用 chrome 并使用 jsfiddle，请尝试在加载到 jsfiddle 时使用 http。希望这可以帮到你！

编辑：意味着使用http加载jsfiddle：http://jsfiddle.net/d6p80yuk/

【讨论】：

我在本地系统上使用此代码。如示例代码所示，我正在尝试从本地系统加载图像。它给了我与小提琴中发布的相同的结果。一个空的织物项目。我检查了chrome中的网络日志。 xhr 请求返回代码 200。
JSfiddle 是为了展示我正在使用的代码。如果有更多调试我必须检查请提及。我可以看到 jsfiddle 的 http 版本有效。我的本地系统使用localhost/app，但不提供来自本地计算机或远程 url 的内容。我正在使用 laravelPHP 5.3