首页 文章

KineticJS是否有SVG的库支持?

提问于
浏览
2

我一直在寻找FabricJSKineticJS作为我正在进行的项目的潜在解决方案,并且像FabricJS对SVG的库级支持一样 . 然而,它缺乏缩放和平移功能让我想要更多 . 出于这个原因,我开始(再次)在KineticJS上寻找 .

我在KineticJS文档中没有看到有关SVG支持的内容,我想知道是否有人可以告诉我KineticJS是否支持渲染SVG图像作为其框架的一部分 . 我假设就KineticJS而言,SVG只是另一个Image,因此应该在框架中对其进行处理 .

此外,当我在网上搜索关于SVG和画布的文章时,我看到了讨论 SVG or Canvas 的页面和文章 . 我不认为这两者是相互排斥的 . <canvas> 元素本身不支持SVG吗?

2 回答

  • 2

    As you suspect, canvas and KineticJS both treat SVG as just another image.

    是的,canvas元素可以使用 drawImage 来绘制svg图像 .

    是的,您也可以将SVG图像加载到kineticJS中:

    var stage = new Kinetic.Stage({
        container: 'container',
        width: 400,
        height: 400
    });
    var layer = new Kinetic.Layer();
    stage.add(layer);
    
    var img=new Image();
    img.onload = function () {
        var image = new Kinetic.Image({
            image: img,
            x: 20,
            y: 20,
            width: 75,
            height: 75,
        });
        layer.add(image);
        layer.draw();
    
    }
    img.crossOrigin="anonymous";
    img.src = "https://dl.dropboxusercontent.com/u/139992952/stackoverflow/rocket.svg";
    

    另一方面,

    FabricJS更多地支持操作SVG元素 .

  • 1

    KineticJS通过路径形状支持SVG . 这是一个教程:

    http://www.html5canvastutorials.com/kineticjs/html5-canvas-kineticjs-path-tutorial/

相关问题