html微信小程序鏡像翻轉


	document.body.innerHTML=`<canvas id="myCanvas"  style="border:1px solid #d3d3d3;height:100px;width:100px"></canvas>
	<br/>
	<canvas id="myCanvas1"  style="border:1px solid #d3d3d3;height:100px;width:100px;"></canvas>`;
	var c=document.getElementById("myCanvas");
	var ctx=c.getContext("2d");
	ctx.fillText("要寫", 20, 20);
	ctx.fillText("嘿嘿", 20, 50);
	ctx.fillText("哈哈", 20, 80);

	var width=100,height=100;
	var data = ctx.getImageData(0, 0, width, height);
	bbb=[];
	for(var i=0;i<height;i++){
	    bbb.unshift(...Array.prototype.slice.call(data.data,i*width*4,(i+1)*width*4));
	}
	for(var i=0;i<bbb.length;i++){
	    data.data[i]=bbb[i];
	}
	var c1=document.getElementById("myCanvas1");
	var ctx1=c1.getContext("2d");
	ctx1.putImageData(data,0,0);

將像素數據一行一行重新排列

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章