js代码

<script type="text/javascript">
var Xin = (function(){
	var canvas,ctx,W,H,fontsize,texts,isMouseDown,mouse,position,pos;
	function init(){
		canvas = document.createElement("canvas");
		ctx = canvas.getContext("2d");
		canvas.width = W = window.innerWidth;
		canvas.height = H = window.innerHeight;
		document.body.appendChild(canvas);
		fontsize = 3; //最小字号
		texts = '富强、民主、文明、和谐、自由、平等、公正、法治、爱国、敬业、诚信、友善、';
		isMouseDown = false;
		mouse = {x : 0, y : 0 };
		position = {x : 0, y : 0 };
		pos = 0;
		bindEvents();
	}
	function bindEvents(){
		window.onmousedown = handleMouseDown;
		window.onmousemove = handleMouseMove;
		window.onmouseup = handleMouseUp;
		window.onmouseout = handleMouseUp;
		window.onresize = handleResize;
	}
	function handleResize(){
		canvas.width = window.innerWidth;
		canvas.height = window.innerHeight;
	}
	function handleMouseDown(){
		isMouseDown = true;
		position.x = event.pageX;
		position.y = event.pageY;
	}
	function handleMouseMove(){
		if(isMouseDown){
			mouse.x  = event.pageX;
			mouse.y  = event.pageY;
			var d = caculateLength(mouse,position),
				fontSize = fontsize + d /2, //计算在不同鼠标速度下的文字字号
				text = texts[pos],
				stepSize = textWidth(ctx,fontSize,text); //计算位置的宽度
			if(d>stepSize){
				//计算偏离角度
				var angle = Math.atan2(mouse.y-position.y,mouse.x-position.x);
				//绘制文字
				ctx.font = fontSize + "px Arial";
				ctx.fillStyle = randC();
				ctx.save();
				ctx.translate(position.x,position.y);
				ctx.rotate(angle);
				ctx.fillText(text,0,0);
				ctx.restore();
				pos++;
				if(pos==texts.length){
					pos = 0;
				}
				//更新位置
				position.x += stepSize * Math.cos(angle);
				position.y += stepSize * Math.sin(angle);
			}
		}
	}
	function handleMouseUp(){
		isMouseDown = false;
	}
	function caculateLength(p1,p2){
		return Math.sqrt(Math.pow(p2.x-p1.x,2)+Math.pow(p2.y-p1.y,2));
	}
	function textWidth(ctx,fontSize,text){
		ctx.font = fontSize + "px Arial";
		if(ctx.fillText){
			return ctx.measureText(text).width;
		}else if(ctx.mozDrawText){
			return ctx.mozMeasureText(text);
		}
	}
	function randC(){
		return 'rgb(' + (~~(Math.random()*255)) + "," + (~~(Math.random()*255)) + "," + (~~(Math.random()*255)) + ")";
	}
	return { init : init }
})();
Xin.init();
</script>