日本欧洲视频一区_国模极品一区二区三区_国产熟女一区二区三区五月婷_亚洲AV成人精品日韩一区18p

代做COMP27112、代寫Java語言程序

時(shí)間:2024-03-08  來源:  作者: 我要糾錯(cuò)



Introduction to Visual Computing
Coursework Assignment 2
Sun, Planet and Moon
Tim Morris
Introduction
The aim of this exercise is to render a simple solar system with one moon orbiting one
planet orbiting one sun. As with the previous exercise, you’ll need a web browser to display
the output and a simple text editor1 to create the html file you’ll need.
This piece of work contributes half of the coursework assessment. We suggest that you
should not spend more than 15 hours in total completing Assignments 1 and 2.
Getting Started
Start off with the same code as last time for creating the basic webpage. Under “// Your
Javascript will go here.” you’ll add any global variables and calls to two
functions, init() and animate().
Creating the Scene (init();)
Everything is initialised in this function.
As before, add a scene, camera and renderer and add the renderer to the
document (don’t forget to declare the scene, camera and renderer as global
variables). You won’t need a vertex shader or fragment shader this time.
Put the far plane of the camera at 10000. Locate the camera at (0, 30, 500) and add it to the
scene.
You’ll need to create nine variables for the sun’s, earth’s and moon’s geometries, materials
and meshes. These are global variables.
You can create the sun object using the following code:
1 You should ensure that your text editor saves your html files as plain text. Some editors (e.g. TextEdit on the
Mac add all kinds of stuff to what you think is a plain html file, meaning that you just see the text of your file
when you open it in your browser. Don’t forget to give your files the correct extension.
You could also use a suitable IDE.
sunGeometry = new THREE.SphereGeometry(109, 400, 200);
sunMaterial = new THREE.MeshStandardMaterial(
 {
 emissive: 0xffd700,
// emissiveMap: texture,
 emissiveIntensity: 1,
 wireframe: false
 }
);
sunMesh = new THREE.Mesh(sunGeometry, sunMaterial);
scene.add(sunMesh);
This creates a spherical object (what do the arguments mean?) of a particular colour. Where
is it located? The emissiveMap is something you may use later.
The sun must be a source of light. The PointLight() constructor can achieve this.
Create a point light source of white light at the origin and add it to the scene. You might also
add a diffuse light to give some background illumination, use AmbientLight().
Obviously this is physically unrealistic but it makes the objects more visible.
You can create the earth and moon using similar code with the following differences:
• The earth sphere geometry arguments are 25, 50, 50
• The moon sphere geometry arguments are 5, 40, 20
• Both the earth and moon materials are MeshPhongMaterial, they don’t have an
emissive argument, but do have a color. You can experiment with color
values.
The texture argument might be used later. So the earthMaterial can be created
using something like:
earthMaterial = new THREE.MeshPhongMaterial(
 {
// map: texture,
 color: x0000ff
 }
The earth and moon will be grouped together into one object before being added to the
scene. To do this we need a global variable to store the earth-moon system, we need to
add the earth to it, by default it will go to the origin of this system. Then we need to add the
moon to the system and set its position relative to the earth.
Three.js provides a group object for storing collections:
earthSystem = new THREE.Group();
Then the earth (and moon) can be added to this in a manner that was similar to the way we
added the sun to the scene:
earthSystem.Add(earthMesh);
Don’t forget to set the position of the moon within the earth-moon system, using a function
something like:
moonMesh.position.set(orbitRadius, 0, 0);
A suitable value for orbitRadius is in the range 40 – 60.
The earth’s orbit could be approximated as a circle, and the location of the earth on it could
be computed as the following pseudocode:
earth.position.x = earthOrbitRadius * sin(2pwt);
earth.position.y = earthOrbitRadius * cos(2pwt);
w is the earth’s angular velocity and t is some measurement of time.
It is slightly more realistic to make the orbit an ellipse. To make this more efficient we precompute the co-ordinates of the earth’s orbit. Create a global variable with a suitable name.
The points can be computed by calling the function EllipseCurve. This has arguments
to define:
• The x co-ordinate of the centre point of the ellipse
• The y co-ordinate of the centre point of the ellipse
• The radius of the ellipse in the x direction
• The radius of the ellipse in the y direction
• The start angle for drawing the ellipse (in this case 0 radians)
• The end angle for drawing the ellipse (in this case 2p radians)
• Plus other arguments that can take default values.
You may choose to draw the orbit, in which case you will have to
• Transfer points from the orbit into a line buffer
• Create a geometry (using BufferGeometry) from these points
• Create a material (using LineBasicMaterial) and setting a suitable colour
• Create a line object using the geometry and material
• Rotate the line so it lies in the XZ plane instead of the default XY plane
• Add it to the scene
Animation (Animate();)
The basic animation function will contain the two lines to render the scene and request an
animation frame, as in the previous exercise. If you’ve followed the instructions so far and
now implement this, you’ll see a static scene with the sun, earth and moon in fixed positions
and the earth orbit (if you chose to draw it). The earth and moon should be solid coloured
spheres. The next step is to add movement to the objects. The following code should be
added to Animate() before the two lines you’ve just written.
The sun’s movement is simple. It doesn’t move. You might want to make it rotate if you add
a texture to it, which will be done later.
The earth-moon system’s position could be driven by using a counter that is incremented
for each frame of the animation. But we’ll use the time instead. A time can be obtained by
calling performance.now(). This gives the time in milliseconds since the browser
window was opened. This can be converted into a value in the range [0, 1) which will be
used as an index into the values of the EllipseCurve you defined earlier. In
pseudocode:
time = 0.00001 * performance.now();
t = (time mod 1)
We can get the earth-moon position by reading a point from the EllipseCurve object
(assume it’s called curve):
point = curve.getPoint(t)
Then the earthSystem’s x and z positions can be set to point.x and point.y
respectively. Changing the value of the multiplier (0.00001) will change the earth’s orbital
speed.
The moon’s position is set according to
moon.x = orbitRadius*cos(time*speed)
moon.z = orbitRadius*sin(time*speed)
Time was derived above. Speed is the orbital speed of the moon – you choose a sensible
value.
Optional Enhancements
Some optional enhancements follow.
Changing the viewpoint
It is possible to change the observer’s viewpoint by adding the following controls.
Insert the following line after the other import statement.
import { OrbitControls } from
"https://web.cs.manchester.ac.uk/three/three.jsmaster/examples/jsm/controls/OrbitControls.js";
Add a global variable with a suitable name, possibly controls.
Add the following two lines to the init() function:
controls = new OrbitControls(camera, renderer.domElement);
controls.autoRotate = true;
These add a controller to the scene and allow you to move the viewpoint by clicking and
dragging.
Texturing
The sun, earth and moon can be textured using textures from
https://www.solarsystemscope.com/textures/download/2k_sun.jpg
https://upload.wikimedia.org/wikipedia/commons/a/ac/Earthmap1000x500.jpg
https://svs.gsfc.nasa.gov/vis/a000000/a004700/a004720/lroc_color_poles_1k.jpg
To read these you’ll have to create one texture loader
const loader = new THREE.TextureLoader();
Textures can be loaded using this
var texture = loader.load(‘filename’); OR
var texture = loader.load(‘URL’);
And added to the material of the object you’re creating, by uncommenting the line in the
example above where you created the sun object.
The earth and moon textures can be added similarly, except you’ll add the line
map: texture,
to the material constructor. You’ll also need to delete the color property.
The problem you may encounter when attempting to run the code is that the resource fails
to load, and you have an error message such as
Access to image at <source> from origin 'null' has been blocked by CORS policy
This is a security feature of most modern browsers. You can set up a server on your host to
overcome this problem. Instructions are widely available on the web, specifically here
https://threejs.org/docs/index.html#manual/en/introduction/How-to-run-things-locally
If you’re using Chrome you can alternatively install an extension that allows CORS cross
origin loading (https://chrome.google.com/webstore/detail/allow-cors-accesscontrol/lhobafahddgcelffkeicbaginigeejlf?hl=en). Or in Safari you can explicitly turn off the
CORS checking.
Rotations
You can make the sun, Earth and Moon rotate on their axes, much like the cube rotated in
the previous exercise. Make sure you choose an appropriate length of the “day”.
Clouds
You could add clouds to the Earth. Find a cloud image (e.g.
https://i.stack.imgur.com/B3c7G.jpg) and add it as a transparent texture to a sphere mesh
that is slightly larger than the Earth. Make it rotate slightly slower than the Earth.
Background
You can also create a starry background for the scene. Make a very large sphere mesh – to
make sure it’s big enough to contain everything. Add a texture image of the Milky Way:
https://cdn.eso.org/images/screen/eso0932a.jpg
Make the sphere visible from inside as well as outside by setting the side member of the
material to THREE.DoubleSide.
Submission
Once you have a working solution, capture a short video of your solution, no more than 15
seconds long. It must demonstrate all the properties of your solar system, and not so
quickly that the marker can’t see them clearly (you’ll be penalised for videos that have so
much zooming or camera movement that it’s impossible to see the earth or moon rotating).
ZIP this and your html and submit the file to the Lab 2 area in Blackboard.
Submissions that are not in the ZIP format will not be marked.
Marking Scheme
We will endeavour to mark your work in face-to-face sessions in the scheduled labs.
You will receive marks for:
• The objects being in appropriate locations and moving appropriately.
請(qǐng)加QQ:99515681  郵箱:99515681@qq.com   WX:codehelp 

標(biāo)簽:

掃一掃在手機(jī)打開當(dāng)前頁(yè)
  • 上一篇:SCC312代做、代寫Java編程語言
  • 下一篇:代寫CSC8208、Java/c++編程語言代做
  • 無相關(guān)信息
    昆明生活資訊

    昆明圖文信息
    蝴蝶泉(4A)-大理旅游
    蝴蝶泉(4A)-大理旅游
    油炸竹蟲
    油炸竹蟲
    酸筍煮魚(雞)
    酸筍煮魚(雞)
    竹筒飯
    竹筒飯
    香茅草烤魚
    香茅草烤魚
    檸檬烤魚
    檸檬烤魚
    昆明西山國(guó)家級(jí)風(fēng)景名勝區(qū)
    昆明西山國(guó)家級(jí)風(fēng)景名勝區(qū)
    昆明旅游索道攻略
    昆明旅游索道攻略
  • NBA直播 短信驗(yàn)證碼平臺(tái) 幣安官網(wǎng)下載 歐冠直播 WPS下載

    關(guān)于我們 | 打賞支持 | 廣告服務(wù) | 聯(lián)系我們 | 網(wǎng)站地圖 | 免責(zé)聲明 | 幫助中心 | 友情鏈接 |

    Copyright © 2025 kmw.cc Inc. All Rights Reserved. 昆明網(wǎng) 版權(quán)所有
    ICP備06013414號(hào)-3 公安備 42010502001045

    日本欧洲视频一区_国模极品一区二区三区_国产熟女一区二区三区五月婷_亚洲AV成人精品日韩一区18p

              久久亚洲影音av资源网| 国产精品国产a级| 99v久久综合狠狠综合久久| 欧美精品免费观看二区| 亚洲美女电影在线| 国产精品自在欧美一区| 狂野欧美激情性xxxx欧美| 亚洲美女黄色片| 在线观看欧美一区| 欧美三级在线| 久久婷婷久久一区二区三区| 亚洲精选中文字幕| 国产日韩一区二区三区| 欧美精品一区二区三区四区| 国产精品久久久久av免费| 在线看片一区| 国产精品久久国产精麻豆99网站| 久久精品一区二区三区四区 | 亚洲欧美国产三级| 亚洲人成人99网站| 一区一区视频| 在线免费观看欧美| 国产一区二区三区四区| 欧美午夜不卡在线观看免费 | 久久精品中文字幕一区| 亚洲精品国产欧美| 亚洲第一页在线| 国产精品久久久久毛片软件 | 欧美怡红院视频一区二区三区| 国产精品99久久不卡二区| 亚洲精选一区| 国产精品99久久久久久宅男| 欧美亚洲一区二区三区| 亚洲综合日韩中文字幕v在线| 在线看欧美日韩| 亚洲欧美综合国产精品一区| 欧美婷婷久久| 欧美日韩系列| 欧美日本一区二区高清播放视频| 欧美激情精品久久久久久蜜臀| 欧美高清在线视频观看不卡| 欧美欧美天天天天操| 欧美性色aⅴ视频一区日韩精品| 欧美午夜在线观看| 黑人巨大精品欧美一区二区| 亚洲精品免费网站| 午夜国产一区| 久久精品盗摄| 激情综合色丁香一区二区| 欧美日韩精品免费观看视频| 欧美在线视频一区二区三区| 免费看的黄色欧美网站| 欧美日韩国产天堂| 国产嫩草一区二区三区在线观看| 激情小说另类小说亚洲欧美| 亚洲一区二区三区免费在线观看| 久久香蕉国产线看观看av| 欧美色视频日本高清在线观看| 国内成+人亚洲| 午夜精品免费视频| 欧美人与性动交cc0o| 国产欧美精品在线播放| 欧美激情视频一区二区三区在线播放 | 国产视频亚洲精品| 亚洲一区激情| 欧美日韩一区免费| 一区二区久久久久久| 欧美色视频在线| 国产日韩亚洲欧美| 精品va天堂亚洲国产| 午夜精品久久久久久久99水蜜桃| av成人老司机| 亚洲综合三区| 久久九九电影| 国产一区二区三区四区五区美女 | 免费成人毛片| 亚洲国产日韩欧美| 久久久久久久国产| 好吊日精品视频| 久久九九国产精品怡红院| 国产麻豆一精品一av一免费| 亚洲在线一区二区| 国产欧美日韩亚州综合| 久久国产一区二区三区| 国产曰批免费观看久久久| 性娇小13――14欧美| 国产精品香蕉在线观看| av成人免费| 国产精品一卡二卡| 久久在线视频在线| 亚洲精品视频免费在线观看| 欧美性做爰猛烈叫床潮| 亚洲欧洲一区二区三区| 欧美性事免费在线观看| 亚洲免费一级电影| 尤物九九久久国产精品的特点 | aa国产精品| 国产亚洲精品高潮| 香蕉av777xxx色综合一区| 亚洲国产精品成人va在线观看| 欧美日韩精品免费| 久久亚洲风情| 亚洲伊人一本大道中文字幕| 亚洲激情综合| 国产一区二区三区在线观看免费| 免费成人你懂的| 亚洲欧洲av一区二区| 99成人在线| 亚洲国产精品99久久久久久久久| 国产精品一区二区在线观看网站 | 欧美日韩免费一区| 免播放器亚洲一区| 久久裸体艺术| 韩国成人理伦片免费播放| 国产精品午夜电影| 欧美男人的天堂| 欧美精品在线观看一区二区| 老鸭窝亚洲一区二区三区| 久久国产精品久久久久久久久久| 亚洲午夜精品在线| 在线视频欧美精品| 中文在线资源观看网站视频免费不卡| 亚洲丶国产丶欧美一区二区三区| 国产日产欧产精品推荐色 | 国产精品女主播一区二区三区| 美女露胸一区二区三区| 老鸭窝毛片一区二区三区| 久久手机免费观看| 欧美精品国产一区| 欧美日韩成人免费| 欧美日韩国产二区| 国产精品久久久久久久久婷婷| 国产精品免费观看在线| 黄色国产精品| 国内精品久久久久久影视8| 激情丁香综合| 亚洲精品老司机| 亚洲欧美综合| 欧美99久久| 国外精品视频| 亚洲精品久久久久久一区二区 | 亚洲欧美大片| 欧美一级一区| 欧美日韩一区二区高清| 国产亚洲人成a一在线v站| 国产日韩精品一区二区浪潮av| 亚洲欧洲日韩在线| 欧美主播一区二区三区| 欧美高清在线观看| 国产一区二区三区无遮挡| 亚洲精品乱码视频| 久久精品91久久久久久再现| 国产精品第一区| 亚洲精品中文在线| 麻豆av一区二区三区| 黄色在线成人| 久久久av毛片精品| 国产一区二区黄| 久久精品91| 激情五月婷婷综合| 夜夜嗨av一区二区三区四季av | 国产精品久久久久影院亚瑟| 中文日韩在线| 欧美日韩一区国产| 一区二区三区四区五区视频| 老司机精品久久| 国语精品中文字幕| 午夜亚洲影视| 国产一区二区三区久久久| 欧美一区二区视频97| 欧美精品一区二区三区蜜桃| 国产欧美va欧美不卡在线| 国产日产欧美精品| 亚洲人成在线观看网站高清| 久久国产高清| 亚洲欧美bt| 亚洲在线网站| 在线一区二区三区四区五区| 亚洲丁香婷深爱综合| 国产日韩在线亚洲字幕中文| 欧美高清一区二区| 欧美一级在线播放| 99xxxx成人网| 亚洲美女91| 国产日韩欧美在线播放不卡| 欧美黑人在线观看| 久久国产日韩| 性久久久久久久久久久久| 亚洲精品偷拍| 99re热精品| 国产农村妇女精品一区二区| 欧美理论在线| 久久久噜噜噜久久中文字幕色伊伊| 一本一本久久a久久精品牛牛影视| 日韩一级大片| 亚洲一区二区在| 久久精品日韩一区二区三区| 蜜桃av噜噜一区二区三区| 欧美日韩精品福利| 国产欧美日韩|