哈喽比特
注册  |  登录
0
0

我用three.js造了自己的dreamCar———特斯拉

发表于 3年以前  | 总阅读数：416 次

前言

大家好 ，每个男孩子都喜欢车，包括我也不例外，看社区看到一篇文章， three.js 实现特斯拉，直接分享给大家！我不是在创造就是在找好文章的路上，助你在图形的道路上越走越远！！

简单粗略了解三维

在2D里只有两个坐标,分别是X轴，和Y轴。在3D就多了一个Z轴。相信刚学3D的同学对X轴和Y轴都比较熟悉，Z轴是比较陌生，笔者建议大家可以上 three编辑器的网站尝试创建一些几何物体，找找对3D理解。

image.png

完整效果

car.gif

需要了解这几个概念

笔者用舞台表演来比如:

  1. 场景 Sence 相当于一个舞台，在这里是布置场景物品和表演者表演的地方
  2. 相机 Carma 相当于观众的眼睛去观看
  3. 几何体 Geometry 相当于舞台的表演者
  4. 灯光 light 相当于舞台灯光照射
  5. 控制 Controls 相当于这出舞台剧的总导演

既然知道这几个概念，我们就根据这几大概念以函数形式区分，就很好理解。在这个three程序我分别创建了: setScene、setCarma、 loadfile、setLight、setControls分别对应以上几个概念

创建场景

首先我们还是用vue3的setup方式编写，npm安装three包， 引入 Scene，WebGLRenderer 两个对象，创建两个变量 scene、renderer并赋值，这样就简单搭建了一个场景，场景背景默认是黑色。创建一个init初始化函数，并在onMounted调用

<script setup>
  import {onMounted} from 'vue'
  import { Scene,WebGLRenderer,PerspectiveCamera} from 'three'
  let scene,renderer
  //创建场景
  const setScene = ()=>{
        scene = new Scene()
        renderer = new WebGLRenderer()
        renderer.setSize(innerWidth, innerHeight)
        document.querySelector('.boxs').appendChild(renderer.domElement)
    }
   //初始化所有函数 
   const init = () => {
        setScene()
    }
    //用vue钩子函数调用
    onMounted(init)
</script>

创建相机

有了场景就要加相机，相机相当于人的眼睛去观察几何物体,引入PerspectiveCamera， 参数有4个，具体可以看看官网文档。然后通过实例方法position.set设置相机坐标

<script setup>
  import { Scene,WebGLRenderer,PerspectiveCamera} from 'three'
  let scene,renderer,camera
  //相机的默认坐标
  const defaultMap = {
        x: 510,
        y: 128,
        z: 0,
    }
  //创建场景
  const setScene = ()=>{
        scene = new Scene()
        renderer = new WebGLRenderer()
        renderer.setSize(innerWidth, innerHeight)
        document.querySelector('.boxs').appendChild(renderer.domElement)
    }
  //创建相机  
  const setCamera = () => {
        const {x, y, z} = defaultMap
        camera = new PerspectiveCamera(60, innerWidth / innerHeight, 1, 1000)
        camera.position.set(x, y, z)
    }
   //初始化所有函数 
   const init = () => {
        setScene()
        setCamera()
    }
    //用vue钩子函数调用
    onMounted(init)
</script>

引入特斯拉模型

在three我们除了可以通过api创建几何物体，还可以引入第三方3d模型，具体可以上 sketchfab ，国外一个3d模型下载网站，里面有很多免费的模型下载，这次用特斯拉汽车模型为例，下载一个gltf格式的3D模型。引入GLTFLoader 创建一个loadfile函数并通过Promise返回模型数据，在init函数加上async调用loadfile得到返回模型数据并添加到场景scene

  import {GLTFLoader} from 'three/examples/jsm/loaders/GLTFLoader'
  import { Scene,WebGLRenderer,PerspectiveCamera} from 'three'
  let scene,renderer,camera,directionalLight,dhelper
  let isLoading = ref(true)
  let loadingWidth = ref(0)
  //相机的默认坐标
  const defaultMap = {
        x: 510,
        y: 128,
        z: 0,
    }
  //创建场景
  const setScene = ()=>{
        scene = new Scene()
        renderer = new WebGLRenderer()
        renderer.setSize(innerWidth, innerHeight)
        document.querySelector('.boxs').appendChild(renderer.domElement)
    }
  //创建相机  
  const setCamera = () => {
        const {x, y, z} = defaultMap
        camera = new PerspectiveCamera(60, innerWidth / innerHeight, 1, 1000)
        camera.position.set(x, y, z)
    }
    //通过Promise处理一下loadfile函数
     const loadFile = (url) => {
        return new Promise(((resolve, reject) => {
            loader.load(url,
                (gltf) => {
                    resolve(gltf)
                }, ({loaded, total}) => {
                    let load = Math.abs(loaded / total * 100)
                    loadingWidth.value = load
                    if (load >= 100) {
                        setTimeout(() => {
                            isLoading.value = false
                        }, 1000)
                    }
                    console.log((loaded / total * 100) + '% loaded')
                },
                (err) => {
                    reject(err)
                }
            )
        }))
    }

    //初始化所有函数 
   const init = async() => {
        const gltf =await loadFile('src/assets/3d/tesla_2018_model_3/scene.gltf')
        setScene()
        setCamera()
        scene.add(gltf.scene)
    }
    //用vue钩子函数调用
    onMounted(init)

创建灯光

汽车模型还看不见，所以我们要给它设置灯光，引入DirectionalLight,DirectionalLightHelper,HemisphereLight,HemisphereLightHelper,并设置灯光的参数，使模型可见，并有些反射光面,阴影的效果，然后也在init函数调用 setLight，再增加loop函数，使场景、照相机、模型不停循环调用。然后车模型就能看见啦,看到车出现的那一刻，好像自己的新买的一样，^_^

image.png

  import {GLTFLoader} from 'three/examples/jsm/loaders/GLTFLoader'
 import { Scene,WebGLRenderer,PerspectiveCamera,   DirectionalLight,
        DirectionalLightHelper,
        HemisphereLight,
        HemisphereLightHelper} from 'three'
  let scene,renderer,camera,directionalLight,hemisphereLight,dhelper,hHelper
  let isLoading = ref(true)
  let loadingWidth = ref(0)
  //相机的默认坐标
  const defaultMap = {
        x: 510,
        y: 128,
        z: 0,
    }
  //创建场景
  const setScene = ()=>{
        scene = new Scene()
        renderer = new WebGLRenderer()
        renderer.setSize(innerWidth, innerHeight)
        document.querySelector('.boxs').appendChild(renderer.domElement)
    }
  //创建相机  
  const setCamera = () => {
        const {x, y, z} = defaultMap
        camera = new PerspectiveCamera(60, innerWidth / innerHeight, 1, 1000)
        camera.position.set(x, y, z)
    }
    //通过Promise处理一下loadfile函数
     const loadFile = (url) => {
        return new Promise(((resolve, reject) => {
            loader.load(url,
                (gltf) => {
                    resolve(gltf)
                }, ({loaded, total}) => {
                    let load = Math.abs(loaded / total * 100)
                    loadingWidth.value = load
                    if (load >= 100) {
                        setTimeout(() => {
                            isLoading.value = false
                        }, 1000)
                    }
                    console.log((loaded / total * 100) + '% loaded')
                },
                (err) => {
                    reject(err)
                }
            )
        }))
    }
    // 设置灯光
     const setLight = () => {
        directionalLight = new DirectionalLight(0xffffff, 0.5)
        directionalLight.position.set(-4, 8, 4)
        dhelper = new DirectionalLightHelper(directionalLight, 5, 0xff0000)
        hemisphereLight = new HemisphereLight(0xffffff, 0xffffff, 0.4)
        hemisphereLight.position.set(0, 8, 0)
        hHelper = new HemisphereLightHelper(hemisphereLight, 5)
        scene.add(directionalLight)
        scene.add(hemisphereLight)
    }
    //初始化所有函数 
   const init = async() => {
        const gltf = await loadFile('src/assets/3d/tesla_2018_model_3/scene.gltf')
        setScene()
        setCamera()
        setLight()
        scene.add(gltf.scene)
       loop()
    }
    //使场景、照相机、模型不停调用
     const loop = () => {
        requestAnimationFrame(loop)
        renderer.render(scene, camera)
    }
    //用vue钩子函数调用
    onMounted(init)

控制模型

屏幕录制2021-07-08 下午12.04.36.gif

想用鼠标自由旋转，或者自动旋转，就要引用 OrbitControls对象，创建setControls函数也是在init调用，通过绑定change还可以监听坐标变化，另外也要在loop函数增加 controls.update()才可以更新位置变化

  import { Scene,WebGLRenderer,PerspectiveCamera} from 'three'
  import {GLTFLoader} from 'three/examples/jsm/loaders/GLTFLoader'
  import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls.js'

  let scene,renderer,camera,directionalLight,hemisphereLight,dhelper,hHelper,controls
  let isLoading = ref(true)
  let loadingWidth = ref(0)
  //相机的默认坐标
  const defaultMap = {
        x: 510,
        y: 128,
        z: 0,
    }
  //创建场景
  const setScene = ()=>{
        scene = new Scene()
        renderer = new WebGLRenderer()
        renderer.setSize(innerWidth, innerHeight)
        document.querySelector('.boxs').appendChild(renderer.domElement)
    }
  //创建相机  
  const setCamera = () => {
        const {x, y, z} = defaultMap
        camera = new PerspectiveCamera(60, innerWidth / innerHeight, 1, 1000)
        camera.position.set(x, y, z)
    }
    //通过Promise处理一下loadfile函数
     const loadFile = (url) => {
        return new Promise(((resolve, reject) => {
            loader.load(url,
                (gltf) => {
                    resolve(gltf)
                }, ({loaded, total}) => {
                    let load = Math.abs(loaded / total * 100)
                    loadingWidth.value = load
                    if (load >= 100) {
                        setTimeout(() => {
                            isLoading.value = false
                        }, 1000)
                    }
                    console.log((loaded / total * 100) + '% loaded')
                },
                (err) => {
                    reject(err)
                }
            )
        }))
    }
    // 设置灯光
     const setLight = () => {
        directionalLight = new DirectionalLight(0xffffff, 0.5)
        directionalLight.position.set(-4, 8, 4)
        dhelper = new DirectionalLightHelper(directionalLight, 5, 0xff0000)
        hemisphereLight = new HemisphereLight(0xffffff, 0xffffff, 0.4)
        hemisphereLight.position.set(0, 8, 0)
        hHelper = new HemisphereLightHelper(hemisphereLight, 5)
        scene.add(directionalLight)
        scene.add(hemisphereLight)
    }
    // 设置模型控制
    const setControls = () => {
        controls = new OrbitControls(camera, renderer.domElement)
        controls.maxPolarAngle = 0.9 * Math.PI / 2
        controls.enableZoom = true
        controls.addEventListener('change', render)
    }
    const render = () => {
        map.x = Number.parseInt(camera.position.x)
        map.y = Number.parseInt(camera.position.y)
        map.z = Number.parseInt(camera.position.z)
    }
    //初始化所有函数 
   const init = async() => {
        const gltf =await loadFile('src/assets/3d/tesla_2018_model_3/scene.gltf')
        setScene()
        setCamera()
        setLight()
        setControls()
        scene.add(gltf.scene)
    }

   //使场景、照相机、模型不停调用和更新位置数据
     const loop = () => {
        requestAnimationFrame(loop)
        renderer.render(scene, camera)
        controls.update()

    }

    //用vue钩子函数调用
    onMounted(init)

改变车身颜色

到这里基础的已经搭建好了,接下来我们再加一个功能改变汽车车身颜色,也是展厅展示一个比较基础的功能.创建一个setColor 这里说一下实例scene 有一个traverse函数，它回调了所有模型的子模型信息，只要我们找到对应name属性，就可以更改颜色，和增加贴图等等， 因为对模型结构不怎熟悉,所以根据名字来猜了一下 找到door_前序的名字大概应该就车身的套件。当然如果细分到我只想改引擎盖的颜色就要找出引擎盖套件。当然要很熟悉这个模型结构了

    //设置车身颜色
      const setCarColor = (index) => {
        const currentColor = new Color(colorAry[index])
        scene.traverse(child => {
            if (child.isMesh) {
                console.log(child.name)
                if (child.name.includes('door_')) {
                    child.material.color.set(currentColor)
                }
            }
        })
    }

上完整代码

其他操作都是交给vue控制，包括设置车身颜色、是否自动转动等等。大家运行以下代码的时候记得用vite打包工具创建vue3模板


<template>
    <div class="boxs">
        <div class="maskLoading" v-if="isLoading">
            <div class="loading">
                <div :style="{width : loadingWidth +'%' }"></div>
            </div>
            <div style="padding-left: 10px;">{{parseInt(loadingWidth)}}%</div>
        </div>
        <div class="mask">
            <p>x : {{x}} y:{{y}} z :{{z}}</p>
            <button @click="isAutoFun">转动车</button>
            <button @click="stop">停止</button>
            <div class="flex">
                <div @click="setCarColor(index)" v-for="(item,index) in colorAry"
                     :style="{backgroundColor : item}"></div>
            </div>
        </div>
    </div>
</template>

<script setup>
    import {onMounted, reactive, ref, toRefs} from 'vue'
    import {
        Color,
        DirectionalLight,
        DirectionalLightHelper,
        HemisphereLight,
        HemisphereLightHelper,
        PerspectiveCamera,
        Scene,
        WebGLRenderer
    } from 'three'
    import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls.js'
    import {GLTFLoader} from 'three/examples/jsm/loaders/GLTFLoader'
    //车身颜色数组
    const colorAry = [
        "rgb(216, 27, 67)", "rgb(142, 36, 170)", "rgb(81, 45, 168)", "rgb(48, 63, 159)", "rgb(30, 136, 229)", "rgb(0, 137, 123)",
        "rgb(67, 160, 71)", "rgb(251, 192, 45)", "rgb(245, 124, 0)", "rgb(230, 74, 25)", "rgb(233, 30, 78)", "rgb(156, 39, 176)",
        "rgb(0, 0, 0)"] // 车身颜色数组 
    const loader = new GLTFLoader() //引入模型的loader实例
    const defaultMap = {
        x: 510,
        y: 128,
        z: 0,
    }// 相机的默认坐标
    const map = reactive(defaultMap)//把相机坐标设置成可观察对象
    const {x, y, z} = toRefs(map)//输出坐标给模板使用
    let scene, camera, renderer, controls, floor, dhelper, hHelper, directionalLight, hemisphereLight // 定义所有three实例变量
    let isLoading = ref(true) //是否显示loading  这个load模型监听的进度
    let loadingWidth = ref(0)// loading的进度

    //创建灯光
    const setLight = () => {
        directionalLight = new DirectionalLight(0xffffff, 0.5)
        directionalLight.position.set(-4, 8, 4)
        dhelper = new DirectionalLightHelper(directionalLight, 5, 0xff0000)
        hemisphereLight = new HemisphereLight(0xffffff, 0xffffff, 0.4)
        hemisphereLight.position.set(0, 8, 0)
        hHelper = new HemisphereLightHelper(hemisphereLight, 5)
        scene.add(directionalLight)
        scene.add(hemisphereLight)
    }

    // 创建场景
    const setScene = () => {
        scene = new Scene()
        renderer = new WebGLRenderer()
        renderer.setSize(innerWidth, innerHeight)
        document.querySelector('.boxs').appendChild(renderer.domElement)

    }

    // 创建相机
    const setCamera = () => {
        const {x, y, z} = defaultMap
        camera = new PerspectiveCamera(60, innerWidth / innerHeight, 1, 1000)
        camera.position.set(x, y, z)
    }

    // 设置模型控制
    const setControls = () => {
        controls = new OrbitControls(camera, renderer.domElement)
        controls.maxPolarAngle = 0.9 * Math.PI / 2
        controls.enableZoom = true
        controls.addEventListener('change', render)
    }

    //返回坐标信息
     const render = () => {
        map.x = Number.parseInt(camera.position.x)
        map.y = Number.parseInt(camera.position.y)
        map.z = Number.parseInt(camera.position.z)
    }



    // 循环场景 、相机、 位置更新
    const loop = () => {
        requestAnimationFrame(loop)
        renderer.render(scene, camera)
        controls.update()
    }


    //是否自动转动
    const isAutoFun = () => {
        controls.autoRotate = true
    }
    //停止转动
    const stop = () => {
        controls.autoRotate = false
    }

    //设置车身颜色
    const setCarColor = (index) => {
        const currentColor = new Color(colorAry[index])
        scene.traverse(child => {
            if (child.isMesh) {
                console.log(child.name)
                if (child.name.includes('door_')) {
                    child.material.color.set(currentColor)
                }
            }
        })
    }

    const loadFile = (url) => {
        return new Promise(((resolve, reject) => {
            loader.load(url,
                (gltf) => {
                    resolve(gltf)
                }, ({loaded, total}) => {
                    let load = Math.abs(loaded / total * 100)
                    loadingWidth.value = load
                    if (load >= 100) {
                        setTimeout(() => {
                            isLoading.value = false
                        }, 1000)
                    }
                    console.log((loaded / total * 100) + '% loaded')
                },
                (err) => {
                    reject(err)
                }
            )
        }))
    }


       //初始化所有函数
    const init = async () => {
        setScene()
        setCamera()
        setLight()
        setControls()
        const gltf = await loadFile('src/assets/3d/tesla_2018_model_3/scene.gltf')
        scene.add(gltf.scene)
        loop()
    }
      //用vue钩子函数调用
    onMounted(init) 
</script>

<style>
    body {
        margin: 0;
    }

    .maskLoading {
        background: #000;
        position: fixed;
        display: flex;
        justify-content: center;
        align-items: center;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        z-index: 1111111;
        color: #fff;
    }

    .maskLoading .loading {
        width: 400px;
        height: 20px;
        border: 1px solid #fff;
        background: #000;
        overflow: hidden;
        border-radius: 10px;

    }

    .maskLoading .loading div {
        background: #fff;
        height: 20px;
        width: 0;
        transition-duration: 500ms;
        transition-timing-function: ease-in;
    }

    canvas {
        width: 100%;
        height: 100%;
        margin: auto;
    }

    .mask {
        color: #fff;
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
    }

    .flex {
        display: flex;
        flex-wrap: wrap;
        padding: 20px;

    }

    .flex div {
        width: 10px;
        height: 10px;
        margin: 5px;
        cursor: pointer;
    }
</style>

屏幕录制2021-07-08 下午1.39.03.gif

总结

「很感谢你能看到这里，如果觉得写的不错， 帮我点个赞 」，让更多同学看到， 如果有任何问题欢迎直接私信我。多交流，多学习。

本文由哈喽比特于3年以前收录，如有侵权请联系我们。
文章来源：https://mp.weixin.qq.com/s/_RvM5WJW6YLSfJxGXGTHSA

 相关推荐

刘强东夫妇：“移民美国”传言被驳斥

京东创始人刘强东和其妻子章泽天最近成为了互联网舆论关注的焦点。有关他们“移民美国”和在美国购买豪宅的传言在互联网上广泛传播。然而，京东官方通过微博发言人发布的消息澄清了这些传言，称这些言论纯属虚假信息和蓄意捏造。

发布于：1年以前  |  808次阅读  |  详细内容 »

博主曝三大运营商，将集体采购百万台华为Mate60系列

日前，据博主“@超能数码君老周”爆料，国内三大运营商中国移动、中国电信和中国联通预计将集体采购百万台规模的华为Mate60系列手机。

发布于：1年以前  |  770次阅读  |  详细内容 »

ASML CEO警告：出口管制不是可行做法，不要“逼迫中国大陆创新”

据报道，荷兰半导体设备公司ASML正看到美国对华遏制政策的负面影响。阿斯麦（ASML）CEO彼得·温宁克在一档电视节目中分享了他对中国大陆问题以及该公司面临的出口管制和保护主义的看法。彼得曾在多个场合表达了他对出口管制以及中荷经济关系的担忧。

发布于：1年以前  |  756次阅读  |  详细内容 »

抖音中长视频App青桃更名抖音精选，字节再发力对抗B站

今年早些时候，抖音悄然上线了一款名为“青桃”的 App，Slogan 为“看见你的热爱”，根据应用介绍可知，“青桃”是一个属于年轻人的兴趣知识视频平台，由抖音官方出品的中长视频关联版本，整体风格有些类似B站。

发布于：1年以前  |  648次阅读  |  详细内容 »

威马CDO：中国每百户家庭仅17户有车

日前，威马汽车首席数据官梅松林转发了一份“世界各国地区拥车率排行榜”，同时，他发文表示：中国汽车普及率低于非洲国家尼日利亚，每百户家庭仅17户有车。意大利世界排名第一，每十户中九户有车。

发布于：1年以前  |  589次阅读  |  详细内容 »

研究发现维生素 C 等抗氧化剂会刺激癌症生长和转移

近日，一项新的研究发现，维生素 C 和 E 等抗氧化剂会激活一种机制，刺激癌症肿瘤中新血管的生长，帮助它们生长和扩散。

发布于：1年以前  |  449次阅读  |  详细内容 »

苹果据称正引入3D打印技术，用以生产智能手表的钢质底盘

据媒体援引消息人士报道，苹果公司正在测试使用3D打印技术来生产其智能手表的钢质底盘。消息传出后，3D系统一度大涨超10%，不过截至周三收盘，该股涨幅回落至2%以内。

发布于：1年以前  |  446次阅读  |  详细内容 »

千万级抖音网红秀才账号被封禁

9月2日，坐拥千万粉丝的网红主播“秀才”账号被封禁，在社交媒体平台上引发热议。平台相关负责人表示，“秀才”账号违反平台相关规定，已封禁。据知情人士透露，秀才近期被举报存在违法行为，这可能是他被封禁的部分原因。据悉，“秀才”年龄39岁，是安徽省亳州市蒙城县人，抖音网红，粉丝数量超1200万。他曾被称为“中老年...

发布于：1年以前  |  445次阅读  |  详细内容 »

亚马逊股东起诉公司和贝索斯，称其在购买卫星发射服务时忽视了 SpaceX

9月3日消息，亚马逊的一些股东，包括持有该公司股票的一家养老基金，日前对亚马逊、其创始人贝索斯和其董事会提起诉讼，指控他们在为 Project Kuiper 卫星星座项目购买发射服务时“违反了信义义务”。

发布于：1年以前  |  444次阅读  |  详细内容 »

苹果上线AppsbyApple网站，以推广自家应用程序

据消息，为推广自家应用，苹果现推出了一个名为“Apps by Apple”的网站，展示了苹果为旗下产品（如 iPhone、iPad、Apple Watch、Mac 和 Apple TV）开发的各种应用程序。

发布于：1年以前  |  442次阅读  |  详细内容 »

特斯拉美国降价引发投资者不满：“这是短期麻醉剂”

特斯拉本周在美国大幅下调Model S和X售价，引发了该公司一些最坚定支持者的不满。知名特斯拉多头、未来基金（Future Fund）管理合伙人加里·布莱克发帖称，降价是一种“短期麻醉剂”，会让潜在客户等待进一步降价。

发布于：1年以前  |  441次阅读  |  详细内容 »

光刻机巨头阿斯麦：拿到许可，继续对华出口

据外媒9月2日报道，荷兰半导体设备制造商阿斯麦称，尽管荷兰政府颁布的半导体设备出口管制新规9月正式生效，但该公司已获得在2023年底以前向中国运送受限制芯片制造机器的许可。

发布于：1年以前  |  437次阅读  |  详细内容 »

马斯克与库克首次隔空合作：为苹果提供卫星服务

近日，根据美国证券交易委员会的文件显示，苹果卫星服务提供商 Globalstar 近期向马斯克旗下的 SpaceX 支付 6400 万美元（约 4.65 亿元人民币）。用于在 2023-2025 年期间，发射卫星，进一步扩展苹果 iPhone 系列的 SOS 卫星服务。

发布于：1年以前  |  430次阅读  |  详细内容 »

𝕏（推特）调整隐私政策，可拿用户发布的信息训练 AI 模型

据报道，马斯克旗下社交平台𝕏（推特）日前调整了隐私政策，允许 𝕏 使用用户发布的信息来训练其人工智能（AI）模型。新的隐私政策将于 9 月 29 日生效。新政策规定，𝕏可能会使用所收集到的平台信息和公开可用的信息，来帮助训练 𝕏 的机器学习或人工智能模型。

发布于：1年以前  |  428次阅读  |  详细内容 »

荣耀CEO谈华为手机回归：替老同事们高兴，对行业也是好事

9月2日，荣耀CEO赵明在采访中谈及华为手机回归时表示，替老同事们高兴，觉得手机行业，由于华为的回归，让竞争充满了更多的可能性和更多的魅力，对行业来说也是件好事。

发布于：1年以前  |  423次阅读  |  详细内容 »

AI操控无人机能力超越人类冠军

《自然》30日发表的一篇论文报道了一个名为Swift的人工智能（AI）系统，该系统驾驶无人机的能力可在真实世界中一对一冠军赛里战胜人类对手。

发布于：1年以前  |  423次阅读  |  详细内容 »

AI生成的蘑菇科普书存在可致命错误

近日，非营利组织纽约真菌学会（NYMS）发出警告，表示亚马逊为代表的电商平台上，充斥着各种AI生成的蘑菇觅食科普书籍，其中存在诸多错误。

发布于：1年以前  |  420次阅读  |  详细内容 »

社交媒体平台𝕏计划收集用户生物识别数据与工作教育经历

社交媒体平台𝕏（原推特）新隐私政策提到：“在您同意的情况下，我们可能出于安全、安保和身份识别目的收集和使用您的生物识别信息。”

发布于：1年以前  |  411次阅读  |  详细内容 »

国产扫地机器人热销欧洲，国产割草机器人抢占欧洲草坪

2023年德国柏林消费电子展上，各大企业都带来了最新的理念和产品，而高端化、本土化的中国产品正在不断吸引欧洲等国际市场的目光。

发布于：1年以前  |  406次阅读  |  详细内容 »

罗永浩吐槽iPhone15和14不会有区别，除了序列号变了

罗永浩日前在直播中吐槽苹果即将推出的 iPhone 新品，具体内容为：“以我对我‘子公司’的了解，我认为 iPhone 15 跟 iPhone 14 不会有什么区别的，除了序（列）号变了，这个‘不要脸’的东西，这个‘臭厨子’。

发布于：1年以前  |  398次阅读  |  详细内容 »

扫码在手机上访问

为您提供高质量的文档
 相关文章
Android插件化方案 5年以前  |  237224次阅读
vscode超好用的代码书签插件Bookmarks 2年以前  |  8059次阅读
 目录

去登录