Android NDK开发

使用函数画出天空的云层图像:

y





主要使用到的是数学的圆与弧度之间转换关系:

代码如下


//div对象
var parentContainer = document.getElementById("container");


(function(window) {
var utils = window.utils || {};
window.utils = utils || window.utils;
/**
* 获取1-seek的随机值
*/
utils.getRandom = function(seek) {
return parseInt(Math.random() * seek + 1);
}
utils.PI = Math.PI;
utils.ROUND = Math.PI * 2;

//根据弧度计算出水平位置长度
utils.getTranslateX = function(r, radious) {
return parseInt(Math.abs(2 * r * Math.sin(90 * radious / 180)));
}
utils.drawCloud = function(container) {
container.moveTo(0, 80);
var i = 0;
var maxWidth = parentContainer.clientWidth;
var x = 0, y = 60, x1 = 0, y1 = 60;
//一弧度=180/pi
container.beginPath();
while (x <= maxWidth) {
var r = utils.getRandom(15);
var radious = utils.getRandom(360) / Math.PI;
var nextX = utils.getTranslateX(r, radious);
container.arc(x + r, y, r, 0, radious, false);
x += nextX;
}


container.closePath();
container.fillStyle = "white";
container.fillRect(0, 60, maxWidth, 60);
container.fill();
}
})(window);


(function(window) {
var canvas = document.createElement("canvas");
canvas.style.position = "absolute";
var ctx = canvas.getContext("2d");
parentContainer.appendChild(canvas);
utils.drawCloud(ctx);


// var c = document.createElement("canvas");
// c.style.position = "absolute";
// cx = c.getContext("2d");
// parentContainer.appendChild(c);
//
// cx.fillText("00000", 70, 50, 50, 50);
})(window)













Android NDK开发,,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。