threejs开发3d地球酷炫效果

最新推荐文章于 2024-08-02 16:25:26 发布

王海虎

最新推荐文章于 2024-08-02 16:25:26 发布

阅读量9.9k

点赞数 12

分类专栏： threejs 3d 酷炫效果文章标签： threejs 3d google earth earth 地球

本文链接：https://blog.csdn.net/xiaohu12685/article/details/107903083

版权

代码如下，详情：https://gitee.com/XiaoHu12685/three-demo/blob/master/examples/earth_tiger.html

<!DOCTYPE html>
<html lang="en">

<head>
	<!-- <title>three.js webaudio - orientation</title> -->
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	<link type="text/css" rel="stylesheet" href="main.css">
</head>

<body>

	<div id="container" style="width:100%;height:100vh;position:relative; overflow: hidden;"></div>

	<script type="module">
		import * as THREE from '../build/three.module.js';

		import Stats from './jsm/libs/stats.module.js';
		import { OrbitControls } from './jsm/controls/OrbitControls.js';
		let renderer, camera, scene, gui, light, stats, controls, geometry, material, line, matLine, mesh, group, radius = 5, groupDots, groupLines, groupHalo, aGroup;
		const Dom = document.querySelector('#container');
		const width = Dom.clientWidth, height = Dom.clientHeight;
		group = new THREE.Group();
		groupDots = new THREE.Group();
		groupLines = new THREE.Group();
		groupHalo = new THREE.Group();
		aGroup = new THREE.Group();

		const posArr = [{ "x": 0.5738958419746141, "y": -0.44114968930852216, "z": 4.9473255920938985 }, { "x": -0.9326350073394328, "y": 2.8399222968004114, "z": -4.00812091773949 }, { "x": 3.469198597393574, "y": 1.2295167303380952, "z": -3.3842206934036057 }, { "x": -2.4019084876611916, "y": -2.190220428765315, "z": 3.7991801866087123 }, { "x": -2.49363689878109, "y": -4.099696049856375, "z": 1.4050862307450966 }, { "x": -2.3729307780326305, "y": 2.840227787960863, "z": 3.3618901878497454 }, { "x": -2.0636200279017873, "y": 0.7444294629976027, "z": -4.493027615657812 }, { "x": 0.47725894517680106, "y": 2.4327372143508037, "z": -4.34212085796347 }, { "x": -2.4777001955161246, "y": -1.2092952460724242, "z": 4.171163716394502 }, { "x": -0.03915748918627658, "y": -0.008362945319338826, "z": 4.999839672648135 }, { "x": 1.5223738738260317, "y": -1.032865814102439, "z

最低0.47元/天解锁文章

王海虎

关注

12
点赞
踩
54

收藏

觉得还不错? 一键收藏
5
评论
threejs开发3d地球酷炫效果

代码如下，详情：https://gitee.com/XiaoHu12685/three-demo/blob/master/examples/earth_tiger.html<!DOCTYPE html><html lang="en"><head>  <meta charset="utf-8"> ..
复制链接

扫一扫

专栏目录