这个是我的代码?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sin字体</title>
</head>
<body>
<svg xmls="http://www.w3.org/2000/svg" width="1000" height="1000">
<defs>
<pattern id="grid" x="0" y="0" width="20" height="20" pattern="userSpaceOnUse">
<path stroke="#ccc" fill="none" d="M0,0H20V20"></path>
</pattern>
</defs>
<rect width="1200" height="1000" fill="url(#grid)"></rect>
<text x="100" y="160" id="sintext">ABCDEFGHIJKLMNOPQRSTUVWXYZ</text>
<path d="M100,0V200M0,160H200" stroke="red"></path>
</svg>
<script type="text/javascript">
//y = a*sin(w*x+t)
//x=[20,20,20....]
var n = 26;
var x = [];
var y = null;
var i = n;
var s = 100;
var w = 0.02;
var t = 0;
while(i--) x.push(20);
function arrange1(t){
y= x.map(function(x){//map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组
return s * Math.sin( w * x + t );
});
};
function arrange(t){
y = [];
var ly = 0,cy;
for(i=0;i<n;i++){
cy = -s*Math.sin(w*i*20+t);
y.push(cy-ly);
ly=cy;
}
}
function render(){
sintext.setAttribute('dx', x.join(' '));//setAttribute()设置属性join()方法把数组中的所有元素放入一个字符串用" "分隔
sintext.setAttribute('dy', y.join(' '));
}
function frame(){
t+=0.01;
arrange(t);
render();
requestAnimationFrame(frame);
}
frame();
</script>
</body>
</html>
我想改个好听点的名字1回答
-
KXFT
什么问题？你没调用js里面的内容?
随时随地看视频慕课网APP
相关分类
JavaScript