HTML5画布kineticjs路径文字教程

来源：互联网发布：百叶窗js 编辑：程序博客网时间：2024/05/13 15:35

创建沿路径kineticjs文本，我们可以实例化一个对象textpath()动力学。对于一个完整的方法和属性的列表，查看kinetic.textpath文件。

<!DOCTYPE HTML><html>  <head>    <style>      body {        margin: 0px;        padding: 0px;      }    </style>  </head>  <body>    <div id="container"></div>    <script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.6.0.min.js"></script>    <script defer="defer">      var stage = new Kinetic.Stage({        container: 'container',        width: 578,        height: 220      });      var layer = new Kinetic.Layer();      var textpath = new Kinetic.TextPath({      x: 100,      y: 50,        fill: '#333',        fontSize: '24',        fontFamily: 'Arial',        text: 'All the world\'s a stage, and all the men and women merely players.',        data: 'M10,10 C0,0 10,150 100,100 S300,150 400,50'      });      layer.add(textpath);      stage.add(layer);    </script>  </body></html>