2k 字 2 分钟

# 描述

项目描述
操作系统Windows 10 专业版
Edge110.0.1587.41 (正式版本) (64 位)
物理分辨率1920x1080

# 像素

像素 Pixel 是计算机图形处理中的一个基本概念，它是 图像元素 的缩写。像素是图像的最小单元，用来表示数字图像或位图图像中的 色彩 和 亮度 信息。

730 字 1 分钟

<template> <div class="app-container"> <div class="sect-container card-container"> <div class="container-body"> <div class="body-left"></div> <div class="divider"></div>...
792 字 1 分钟

npx 官网的简介：https://docs.npmjs.com/cli/v10/commands/npx npx 是一个命令行工具，npm 5.2.0 版本中新增的功能。以前用 vue 的脚手架创建项目，需要全局安装 vue-cli，用 npx 可以不用全局安装就能使用。 vue2 创建项目，之前需要全局安装： npm install @vue/cli -gvue create project-name用 npx 可以直接创建： npx @vue/cli create project-name使用方法就是 npx 包名...
2.2k 字 2 分钟

# 适用场景

  • 多设备兼容：解决不同设备和浏览器中系统字体不一致的问题。
  • 品牌统一：保持品牌的视觉一致性。
  • 高级排版：使用特定的字重和样式，提升排版质量。

# 解决问题

  • 页面加载性能：通过优化字体文件加载，减少页面渲染阻塞。
  • 视觉一致性：确保字体在各种设备上都能正确显示。
  • 易于维护：通过合理的配置和文件结构，方便后续维护和更新。

790 字 1 分钟

# 前言

通过 stats.js 库可以查看 three.js 当前的渲染性能，具体说就是计算 three.js 的渲染帧率 (FPS), 所谓渲染帧率 (FPS)，简单说就是 three.js 每秒钟完成的渲染次数，一般渲染达到每秒钟 60 次为最佳状态。

3.3k 字 3 分钟

# 简介

在 three.js 中动画也是很重要的一环。在使用软件创建模型时，一般都会创建模型的骨骼动画用于在开发中使用。下面我们加载 .fbx 格式的文件模型（它除了包含几何、材质信息，可以存储骨骼动画等数据）来实现动画。

# AnimationMixer

  • 动画混合器是用于场景中特定对象的动画的播放器。当场景中的多个对象独立动画时，每个对象都可以使用同一个动画混合器。
  • 参数： rootObject 混合器播放的动画所属的对象。就是包含动画模型的场景对象。
  • 常用参数和属性：
  1. .time 全局的混合器时间。
  2. .clipAction(AnimationClip) 返回所传入的剪辑参数的 AnimationAction 对象。 AnimationAction 用来调度存储在 AnimationClip 中的动画。
  • AnimationClip 动画剪辑，是一个可重用的关键帧轨道集，它代表动画。
  1. .getRoot() 返回混合器的根对象。
  2. .update() 推进混合器时间并更新动画。在渲染函数中调用更新动画。

6.6k 字 6 分钟

在 Three.js 中，动画是创建互动和动态 3D 内容的关键组件。无论是为游戏、可视化工具，还是艺术项目添加动画效果，使用动画库都能极大地简化这个过程。本篇博客将梳理一些常用的动画库及其在 Three.js 中的应用，帮助开发者更好地理解和使用这些工具。

3.9k 字 4 分钟

# THREE.Clock

时间对象用于跟踪时间，用于计算每一帧的渲染时间或者是从开始渲染到现在的时间。

# 构造函数

var clock = new THREE.Clock();

实例化时间对象还可以接收一个布尔类型的参数，用于设置实例化完成后启动时间对象计时，默认为开启。

# 方法

# .start()

此方法用于启动时间对象开始计时，将所有的信息重置。

# .stop()

停止时间对象的计时。

# .getElapsedTime()

此方法返回自时间对象开启以后到现在的时间。

# .getDelta()

此方法返回上次调用到这次调用此方法的间隔时间，用于计算渲染间隔。