一、期待终极决赛

C站肯定有许多看球的朋友吧。明天即将迎来2022年世界杯终极对决,阿根廷队对战法国。来赶个晚集,也来聊聊世界杯,下一个四年就是2026,会不会还有这种精神呢。先来回顾一下本轮世界杯比赛中的对阵吧。

本轮世界杯中,日本队和韩国队作为亚洲球队挺近8强,当时看得是相当的激动。确实是亚洲之光啊,杀入世界杯8强绝对是实力杠杠的。作为伪球迷,还是强烈希望能看到某足也能出个线,这种话题,小伙伴们保存火力,不要愤怒哈。

二、数说世界杯

1、历年花费

1、1990年意大利世界杯成本:40亿美元;

2、1994年美国世界杯成本:5亿美元;

3、1998年法国世界杯成本:23亿美元;

4、2002年韩日世界杯成本:70亿美元;

5、2006年德国世界杯成本:45亿美元;

6、2010年南非世界杯成本:36亿美元;

7、2014年巴西世界杯成本:150亿美元;

8、2018年俄罗斯世界杯成本:116亿美元;

9、2022年卡塔尔世界杯成本:2290亿美元;

卡塔尔作为能源输出国,今年的世界杯花费2290亿美元,一骑绝尘,直接拉高了整个世界杯的花费成本。疫情纠缠着世界的未来,下一届应该怎么办,有点令人期待了。

2、1990年以来历届冠军

1、第十四届:1990年,意大利世界杯。西德冠军。

2、第十五届:1994年,美国世界杯。巴西冠军。

3、第十六届:1998年,法国世界杯。法国冠军。

4、第十七届:2002年,韩日世界杯。 巴西冠军。

5、第十八届:2006年,德国世界杯。意大利冠军。

6、第十九届:2010年,南非世界杯。 西班牙冠军。

7、第二十届:2014年,巴西世界杯。德国冠军。

8、第二十一届:2018年,俄罗斯世界杯。法国冠军。

巴西作为历届强队,近8届获得过2次世界杯冠军,也是历届世界杯中获得冠军次数最多的。但是本次世界杯中被克罗地亚送回家了,终结了世界杯的征程。

3、2022世界杯进球排行

来看看今年的世界杯中,球员们的进球排行。

姆巴佩和梅西并列榜首,是目前进球数最多的。在冠军争霸赛中,他们会又会上演什么样的精彩赛事,让我们拭目以待吧。

三、Threejs球场小案例

上面作为伪球迷总结了一些本次卡塔尔世界杯和历次世界杯的比赛信息。下面作为技术人分享一个基于Threejs的球场小案例。在实例分享之前,需要准备两张图片,一个足球和足球场地。如下:

完整的代码示例如下:

<!DOCTYPE html>
<html>
<head><title>世界杯</title><script src="three.js"></script><style>body {margin: 0;overflow: hidden;}</style>
</head>
<script>var renderer;var scene;var camera;var control;var camControl;function init() {scene = new THREE.Scene();camera = new THREE.PerspectiveCamera(40, window.innerWidth / window.innerHeight, 0.1, 1000);camera.position.x = 15;camera.position.y = 6;camera.position.z = 15;camera.lookAt(scene.position);renderer = new THREE.WebGLRenderer();renderer.setClearColor(0x000000, 1.0);renderer.setSize(window.innerWidth, window.innerHeight);renderer.shadowMapEnabled = true;var spotLight = new THREE.SpotLight();spotLight.position.set(0, 80, 30);spotLight.castShadow = true;scene.add(spotLight);document.body.appendChild(renderer.domElement);addFloor();addRail();addSphere();render();}function addFloor() {var floorGeom = new THREE.PlaneGeometry(100,100,20,20);var floorMater = new THREE.MeshPhongMaterial();floorMater.map = THREE.ImageUtils.loadTexture('http://localhost:8086/3js/football/cd.jpeg');//沿着(S)x,(T)y方向允许纹理重复自己floorMater.map.wrapS = floorMater.map.wrapT = THREE.REpeatWrapping;//material.map.repeat.set(repeatX,repeatY);repeatX:指定在x轴方向多久重复一次。repeatY:指定在y轴方向多久重复一次。//如果设置为1,都不会重复。 如果设置<1,纹理就会被放大。 如果设置为负数,就会产生纹理镜像。floorMater.map.repeat.set(20,20);var floor = new THREE.Mesh(floorGeom,floorMater);floor.receiveShadow = true;floor.rotation.x = -0.5 * Math.PI;scene.add(floor);}function addRail() {var cylinderGeometry = new THREE.CylinderGeometry(0.1, 0.1,15,50,50);var cylinderMaterial = new THREE.MeshPhongMaterial({color:0xeeeeee});var cylinder = new THREE.Mesh(cylinderGeometry,cylinderMaterial);cylinder.position.set(1,5,1);cylinder.rotation.x = '15';cylinder.rotation.y = '-57.8';cylinder.rotation.z = '-14.85';cylinder.name = 'cylinder';scene.add(cylinder);}function addSphere() {var sphereGeometry = new THREE.SphereGeometry(0.8, 25, 25);var sphereMaterial = new THREE.MeshBasicMaterial({specular: '#a9fcff',emissive: '#006063',shininess: 10});var sphere = new THREE.Mesh(sphereGeometry, sphereMaterial);sphere.position.set(7,0.8,-1);sphere.castShadow = true;var texture = new THREE.ImageUtils.loadTexture("http://localhost:8086/3js/football/football.jpeg");sphereMaterial.map = texture;sphere.name = 'sphere';scene.add(sphere);}var step = 0;function render() {var sphere = scene.getObjectByName('sphere');renderer.render(scene, camera);camera.lookAt(sphere.position);step += 0.02;sphere.position.x = 0 + ( 10 * (Math.cos(step)));sphere.position.y = 0.75 * Math.PI / 2 + ( 6.5 * Math.abs(Math.sin(step)));sphere.rotation.z += 0.03;var x = camera.position.x;var z = camera.position.z;camera.position.x = x * Math.cos(0.015) + z * Math.sin(0.015);camera.position.z = z * Math.cos(0.015) - x * Math.sin(0.015);requestAnimationFrame(render);}function onResize() {camera.aspect = window.innerWidth / window.innerHeight;camera.updateProjectionMatrix();renderer.setSize(window.innerWidth, window.innerHeight);}window.onload = init;window.addEventListener('resize', onResize, false);
</script>
<body>
</body>
</html>

使用Nginx发布以上静态网页后,可以看到以下的效果:

感兴趣的小伙伴可以直接拷贝下去,然后引入一个Threejs的依赖js即可运行。

最后

世界杯迎接总决赛,大家心目中的冠军球队是谁呢?希望大家都能拥有积极的体育精神,团结拼搏奋斗,不离不弃,奔向未来。

世界杯决赛倒计时,你最看好谁相关推荐

  1. 12月18日23点,2022年卡塔尔世界杯决赛,阿根廷对阵法国,上演巅峰对决,谁能捧走大力神杯?

    12月18日23点,2022年卡塔尔世界杯决赛,阿根廷对阵法国,上演巅峰对决,谁能捧走大力神杯? 锁定CCTV5,见证大力神杯的归属 决赛:阿根廷VS法国_大咖陪你看世界杯|2022年世界杯_央视网( ...

  2. 预测2018年世界杯决赛_2018年5个电子商务预测

    预测2018年世界杯决赛 2018 is with us already and it's important in the current competitive market that eComm ...

  3. 葡萄牙晋级世界杯决赛

    北京时间3月30日凌晨结束的世界杯预选赛欧洲区附加赛C组决赛中,葡萄牙2:0战胜此前淘汰了意大利队的北马其顿,成功晋级卡塔尔世界杯决赛. 成功晋级世界杯正赛后,C罗将迎来生涯第5届世界杯

  4. 南非世界杯 决赛 西班牙vs荷兰

    西班牙1:0荷兰 说实话,世界杯决赛真的是因为它重要才会让人半夜看球. 这场踢得很无聊.罗本的两个单刀竟然一个都没有进,唉,如果进了,荷兰也算正名了.算了,无冕之王就继续无冕吧.

  5. 世界杯决赛:意大利夺冠

    我们是冠军 2006-07-10 04:55:01 网易体育德国消息,北京时间7月10日2点,德国世界杯决赛在柏林奥林匹克球场进行.法国与意大利苦战120分钟战成1比1平.点球大战,意大利5比3击败法 ...

  6. 院士领衔,大咖云集!航天智慧物流单项赛决赛倒计时2天!

      本周六早8点30分,第十六届全国大学生智能汽车竞赛-航天智慧物流单项赛的决赛将以线上比赛的方式正式开赛.比赛过程将在哔哩哔哩(B站)平台全程直播(直播二维码见文末海报).   航天智慧物流创意组单 ...

  7. 卡塔尔世界杯进入倒计时,万人观赛的直播体验如何保障?

    11月,全球瞩目的世界杯就要来了!德国战车能否一往无前拿下桂冠?梅西与C罗的命运之战又将如何落幕--热议的焦点层出不穷.如今,互联网直播已成为国民观看世界杯的主要方式,面对世界杯期间的巨大直播流量,如 ...

  8. #Python #2022卡塔尔世界杯 #FIFA World Cup Qatar 2022 # 机器学习 #数据分析 用Python预测世界杯决赛

    今天2022年11月29日的凌晨,葡萄牙队2比0获击败乌拉圭队!葡萄牙队提前晋级16强,你熬夜看这场比赛了吗? 今天晚上11点荷兰将对战卡塔尔,NED(荷兰)有望取胜! 现在让我们通过Python数据 ...

  9. 神了!用Python预测世界杯决赛,发现准确率还挺高!

    那么四年一度的世界杯即将要在卡塔尔开幕了,对于不少热爱足球运动的球迷来说,这可是十分难得的盛宴,而对于最后大力神杯的归属,相信很多人都满怀着期待,每个人心中都有不同的答案. 今天小编就通过Python ...

最新文章

  1. Case Study: 利用JS设计高级检索功能通过PHP获取MySQL数据
  2. 如何处理Entity Framework中的DbUpdateConcurrencyException异常
  3. Asp.net MVC2.0系列文章-MVC简介篇
  4. HDU 3966-Aragorn's Story 树链剖分+树状数组
  5. Spring集成redis(Spring Data Redis)
  6. python3.7界面_Python3.7+tkinter实现查询界面功能
  7. 截取台风后的图片_Python数据分析案例 | 台风最喜欢在我国哪个省市登陆
  8. EF6 Codefirst+MySql 数据库迁移
  9. oracle rollup 排序,oracle分组函数之ROLLUP演示
  10. 【华人学者风采】聂建云 蒙特利尔大学
  11. 成都VS上海,先锋设计机构与未来建筑的“双城battle”
  12. 费马小定理 欧拉定理 逆元
  13. Codeforces Round #521 (Div. 3) E. Thematic Contests(dp)
  14. 2019级软件工程应用与实践-人工智能快递柜(综述)
  15. 仿xp画板、画图重绘、五子棋总结
  16. html中input标签中type属性小总(包含html5新增表单属性)
  17. SHT-31温湿度传感器资料整理
  18. 2019年回头看,英特尔要如何突破存储瓶颈?
  19. 2018-2019 C++程序设计报告
  20. 香农公式与编解码性能的联系

热门文章

  1. html个性花边代码,十种漂亮的多层花边边框代码
  2. 开发项目中,360浏览器遇到的一个坑
  3. 偏偏在面试的时候踏入一个大坑--360浏览器兼容模式
  4. python-pptx----母版制作
  5. 全国php工资城市排名,2019年各城市工资排行_2019年全国各城市最新工资排行出炉 想去哪玩来对...
  6. ionic(mui、elementUI)自定义字体图标
  7. SCSS 中这些实用技巧,你可能还不知道!
  8. CS143 6、7. 自顶向下和自底向上的语法分析
  9. RMAN Encrypted Backups
  10. Google Dremel 原理 – 如何能 3 秒分析 1PB