求用FLASH实现一个“月球绕地球的轨迹着地球转...

来源：蜘蛛抓取(WebSpider) 时间：2011-10-06 14:53 标签： 月球绕地球周期
1152人阅读
HTML5（37）
关于运动速度的参数与真实速度有点差距，大家可以自行调整
&!DOCTYPE html&
&meta http-equiv=&Content-Type& content=&text/ charset=utf-8& /&
&title&地球绕着太阳转，月球绕着地球转&/title&
&canvas width=&600& height=&600& style=&background:black&id=&canvas&&
您的浏览器不支持canvas
//获取画布
var canvas=document.getElementById('canvas');
//获取绘图环境
var cxt=canvas.getContext('2d');
//d单位时间time （1:1天）
var time=0;
function draw(){
//清除画布
cxt.clearRect(0,0,600,600);
//画地球轨道
cxt.strokeStyle=&#FFF&;
cxt.beginPath();
//路径函数
cxt.arc(300,300,180,0,360,false);
cxt.closePath();
cxt.stroke();
cxt.beginPath();
//路径函数 x,y,r,角度范围,顺时针/逆时针
cxt.arc(300,300,20,0,360,false);
cxt.closePath();
//填充(渐变色)
//cxt.createLinearGradient(内圆心x,内圆心y，内半径r,外圆心x，外圆心y，外圆半径r);
var sunColor=cxt.createRadialGradient(300,300,0,300,300,10);
sunColor.addColorStop(0,&#F00&);
sunColor.addColorStop(1,&#F90&);
cxt.fillStyle=sunC
cxt.fill();
cxt.save();
//异次元空间00点
cxt.translate(300,300);
//旋转角度,地球公转一周需要365天，time=1转365/360度
cxt.rotate(time*365/360*Math.PI/180);
cxt.beginPath();
cxt.arc(180,0,10,0,360,false);
var earthColor=cxt.createRadialGradient(180,0,0,180,0,10);
cxt.strokeStyle=&#050c12&;
earthColor.addColorStop(0,&#78B1Eb&);//#&8B1Eb
earthColor.addColorStop(1,&#050c12&);//#050c12
cxt.fillStyle=earthC
cxt.fill();
cxt.closePath();
//画月球轨道和月球
cxt.save();
异次元空间00点,在前边的基础上，画地球时以（300,300）为中心，且未退出异次元空间
月球轨道以地球为中心，在异次元空间，地球为（180,0），这个地方我写错了，改了两个小时才改好 */
cxt.strokeStyle=&#FFF&;
cxt.translate(180,0);
//画月球轨道
cxt.beginPath();
cxt.arc(0,0,30,0,360,false);
cxt.stroke();
cxt.closePath();
cxt.rotate(time*365*Math.PI/180);
cxt.beginPath();
cxt.arc(30,0,5,0,360,false);
var moonColor=cxt.createRadialGradient(30,0,0,30,0,5);
cxt.strokeStyle=&#322222&;
moonColor.addColorStop(0,&#c0a48e&);
moonColor.addColorStop(1,&#322222&);
cxt.fillStyle=moonC
cxt.fill();
cxt.closePath();
cxt.restore();
cxt.restore();
//每画一次图像，时间参数加1
//通过修改第二个参数课调整速度
setInterval(draw,50);
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：887704次
积分：12036
积分：12036
排名：第778名
原创：403篇
转载：29篇
评论：72条
(2)(1)(2)(6)(3)(2)(2)(2)(1)(8)(6)(4)(8)(9)(6)(33)(5)(4)(3)(5)(7)(4)(7)(4)(1)(1)(4)(7)(2)(11)(2)(14)(7)(3)(9)(2)(3)(1)(8)(9)(36)(10)(23)(12)(6)(6)(16)(14)(1)(2)(10)(17)(3)(21)(4)(28)(2)(9)(1)(4)你看不到我~
看不到我……
视频: Flash制作
月球绕地球转
<mendVideo();
分享给好友
月球绕地球转
下载至电脑
扫码用手机看
用或微信扫码在手机上继续观看
二维码2小时内有效
把视频贴到Blog或BBS&&
<input id="link4" type="text" class="form_input form_input_s" value=''>
flash地址:
<input type="text" class="form_input form_input_s" id="link3" value=''>
手机扫码分享视频
二维码2小时内有效
月球绕地球转
扫码用手机继续看
用或微信扫码在手机上继续观看
二维码2小时内有效，扫码后可分享给好友
没有优酷APP？立即下载
请根据您的设备选择下载版本
Flash动态图制作
不是做的太好，技术有限请谅解
万万表情系列（VIP会员专享）
泡芙表情系列（VIP会员专享）
暴漫表情系列（VIP会员专享）
节目制作经营许可证京字670号
药品服务许可证(京)-经营-用FLASH实现一个“月球绕着地球转，地球绕着太阳转”的简单动画_百度知道用FLASH实现一个“月球绕着地球转，地球绕着太阳转”的简单动画_百度知道信息技术《月球围绕地球转》教学设计_百度文库
两大类热门资源免费畅读
续费一年阅读会员，立省24元！
信息技术《月球围绕地球转》教学设计
上传于||暂无简介
阅读已结束，如果下载本文需要使用1下载券
想免费下载本文？
定制HR最喜欢的简历
下载文档到电脑，查找使用更方便
还剩2页未读，继续阅读
定制HR最喜欢的简历
你可能喜欢

我要回帖

更多关于 月球绕地球周期 的文章

 

随机推荐