当前位置: 首页 > news >正文

threejs特殊几何体(一:文字几何体对象)

threejs中文字几何体通过newTextGeometry()生成,它被单独作为一个类存在于threejs中const txtGeo = new TextGeometry("threejs", { ...opts, font: font });

我们先看效果:

 

<template><div></div>
</template>
<script  setup>
import { ref } from "vue";
import * as THREE from "three";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
import { TextGeometry } from "three/examples/jsm/geometries/TextGeometry";
import { FontLoader } from "three/examples/jsm/loaders/FontLoader";
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75,window.innerWidth / window.innerHeight,0.1,1000
);
// const font = new THREE.Font("Arial");
camera.position.set(0, 0, 10);let opts = {size: 3,height: 5,//   fontWeight: "bold",bevelSize: 3,bevelEnabled: false,steps: 7,font: "",bevelThickness: 1
};const ftloader = new FontLoader();
ftloader.load("/src/assets/fonts/helvetiker_regular.typeface.json", font => {const txtGeo = new TextGeometry("sean", { ...opts, font: font });const mesh = new THREE.Mesh(txtGeo,new THREE.MeshBasicMaterial({ color: "#e6c" }));scene.add(mesh);
});const renderder = new THREE.WebGLRenderer();
renderder.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderder.domElement);
renderder.setClearColor("#eee");
const control = new OrbitControls(camera, renderder.domElement);
const render = () => {requestAnimationFrame(render);renderder.render(scene, camera);
};
render();
</script>
<style scoped>
/* body {font-family: Arial, Helvetica, sans-serif;
} */
</style>

这里特别要注意的是:

注意点:1 文字几何体font必须要引入。可以使用three库默认的字体。该字体位于three/example/fonts/文件夹下,默认字体采用了json文件格式
2 给TextGeometry添加配资的时候,font选项不是普通的字体对象而是three里面的字体对象。也就是font是 new FontLoader()。load加载后的字体对象

相关文章:

threejs特殊几何体(一:文字几何体对象)

threejs中文字几何体通过newTextGeometry&#xff08;&#xff09;生成&#xff0c;它被单独作为一个类存在于threejs中const txtGeo new TextGeometry("threejs", { ...opts, font: font }); 我们先看效果&#xff1a; <template><div></div> &…...

链表的实现

本程序List链表用两种方式实现&#xff0c;一种是双向链表&#xff0c;一种是双向循环链表。循环双向链表和双向链表&#xff0c;它们的编码差别很小&#xff1b;但是循环链表在插入效率上胜出很多&#xff0c;同时查询时候更灵活。综合考虑&#xff0c;循环链表是首选。 另外…...

c++ std::mutex与std::condition_variable

1. std::mutex lock()加锁; try_lock()尝试加锁; unlock()解锁; std::mutex m_mutex; m_mutex.lock(); ... m_mutex.unlock(); 2. std::lock_guard 类模板;等同自动锁,直接取代lock()和unlock(); 构造时加锁,析构时解锁; std::mutex m_mutex; {std::lock_guard<std:…...

Aspose.Tasks for .NET V23Crack

Aspose.Tasks for .NET V23Crack 改进了大型项目的内存占用。 添加了API&#xff0c;允许您在应用程序无法访问系统字体文件夹时指定用户的字体文件夹。 Aspose.Tasksfor.NET是处理MicrosoftProject文件的可靠的项目管理API。API支持在不依赖Microsoft Project的情况下读取、写…...

vue过渡及动画

文章目录 前言类名使用自己定义动画样式多个元素过渡使用第三方库 前言 对于vue中的过渡与动画&#xff0c;官网上是这样概述的&#xff1a; Vue 在插入、更新或者移除 DOM 时&#xff0c;提供多种不同方式的应用过渡效果。包括以下工具&#xff1a; 在 CSS 过渡和动画中自动…...

Linux环境下SVN服务器的搭建与公网访问:使用cpolar端口映射的实现方法

文章目录 前言1. Ubuntu安装SVN服务2. 修改配置文件2.1 修改svnserve.conf文件2.2 修改passwd文件2.3 修改authz文件 3. 启动svn服务4. 内网穿透4.1 安装cpolar内网穿透4.2 创建隧道映射本地端口 5. 测试公网访问6. 配置固定公网TCP端口地址6.1 保留一个固定的公网TCP端口地址6…...

【ubuntu】 DNS 设置工具 resolvectl

什么是 resolvectl “resolvectl” 是一个用于管理系统 DNS 解析配置的命令行工具。它是 systemd-resolved 服务的一部分&#xff0c;该服务是在许多基于 Systemd 的 Linux 发行版中用于管理网络配置和 DNS 解析的系统服务。 通过 resolvectl 命令&#xff0c;可以查看当前系…...

Keepalived+Lvs(dr)调度器主备配置小实验

目录 前言 一、实验拓扑图 二、配置LVS&#xff08;dr&#xff09;模式 三、配置调配器热备 四、测试 总结 前言 Keepalived和LVS&#xff08;Linux Virtual Server&#xff09;是两个常用的开源软件&#xff0c;通常结合使用以提供高可用性和负载均衡的解决方案。 Keepalive…...

第四讲Java基本语法——数组结构(多维数组)

前言 前面几讲,我们讲了Java基本语法,初学者也能够有一定的入门。本讲,我们也是继续来讲解一下Java另一个基础语法——数组,其实在前面讲解数据类型的时候,我们也有提到数组是引用类型,那今天我们就来分析一下什么是数组,怎么用数组呢? 一、数组是什么 数组是…...

【题解】JZOJ6578 / 洛谷P5201[USACO2019Jan]Shortcut G

洛谷 P5201 [USACO19JAN] Shortcut G 题意 在一个带权无向连通图上&#xff0c;每个点有 a i a_i ai​ 只奶牛&#xff0c;奶牛会走最短路径到 1 1 1&#xff0c;如果有多条路径&#xff0c;选择字典序最小的&#xff0c;定义移动总时间为所有奶牛走到 1 1 1 的时间之和。…...

npm install sentry-cli失败的问题

1. 目前报错 2. 终端运行 npm set ENTRYCLI_CDNURLhttps://cdn.npm.taobao.org/dist/sentry-cli npm set sentrycli_cdnurlhttps://cdn.npm.taobao.org/dist/sentry-cli3. 再安装 npx sentry/wizardlatest -i nextjs即可成功...

Node opensslErrorStack 错误解决方法记录

从Git仓库中下载了一个老项目&#xff0c;使用npm install 安装后没有问题&#xff0c;当我使用npm run dev 的时候遇到了 OpenSSL 相关错误&#xff0c;例如 opensslErrorStack: [error:03000086:digital envelope routines::initialization error] 网上找了一下相关信息&am…...

你知道什么是Grandmillennial风格吗,进来看看吧

如果你既欣赏祖母的印花棉布扶手椅和大胆的图案&#xff0c;又喜欢千禧一代朋友现代家居中的开放空间和时尚家具&#xff0c;那么 "千禧一代 “风格就是为你量身打造的。它借鉴了几十年来的流行趋势&#xff0c;形成了一种独特的、带有现代风格的老式设计。 在典型的 &quo…...

App Inventor 2 开发 ChatGPT 对话App

ChatGPT大家应该不会陌生&#xff0c;它的回答内容非常的专业及深入&#xff0c;具有实际的可指导性。我们通过App Inventor 2开发一个简单的对话App&#xff0c;先看效果&#xff1a; App Inventor 2 ChatGPT教育领域对话演示 代码块如下&#xff1a; 用到的核心组件“ChatBot…...

SQL 大小敏感问题

在SQL中&#xff0c;关键字和函数名 是不区分 大小写的 比如&#xff08;select、where、order by 、group by update 等关键字&#xff09;&#xff0c;以及函数(ABS、MOD、round、min等) window系统默认是大小写不敏感 &#xff08;ZEN文件和zen 文件 不能同时存在&#xff…...

微信小程序+Taro 混编,Taro 使用微信原生 behaviors

最近有一个小程序项目&#xff0c;因为一些原因项目架构选择了微信小程序原生Taro 混编的方式进行开发&#xff0c;在开发的过程中发现 Taro 不支持使用原生的 behaviors 特性&#xff0c;因为混编的原因项目当中已有原生页面在使用 behaviors&#xff0c;所以需要一个方案在不…...

b树/b+树、时间轮、跳表、LSM-Tree

b树、b树&#xff1a;关系型数据库核心存储结构 1、为什么磁盘数据存储结构用B树、而不用红黑树 磁盘每次读取不是读一个节点、是返回一页数据。 红黑树每次遍历一个节点排除一半数据。 B树通常映射相邻的磁盘页数据。4K mysql索引一个节点隐射16k故而映射4倍&#xff0c;故…...

Unity OnDrawGizmos的简单应用 绘制圆形

编辑器和配置表各有各的好。 卡牌游戏即使再复杂&#xff0c;哪怕是梦幻西游&#xff0c;大话西游那种&#xff0c;甚至wow那种&#xff0c;用配表都完全没问题。但是崩坏3&#xff0c;或者鬼泣&#xff0c;格斗游戏&#xff0c;可视化编辑器是唯一的选择。 开发初期刚开始配技…...

Uniapp笔记(四)uniapp语法3

一、商品详情 1、从商品列表页跳转到商品详情页 在商品列表的项中绑定单击事件&#xff0c;并传递商品id值 <view class"goods-item" v-for"(item,index) in goodsList" :key"index" click"goGoodsDetail(item.goods_id)"> &…...

leetcode做题笔记105. 从前序与中序遍历序列构造二叉树

给定两个整数数组 preorder 和 inorder &#xff0c;其中 preorder 是二叉树的先序遍历&#xff0c; inorder 是同一棵树的中序遍历&#xff0c;请构造二叉树并返回其根节点。 思路一&#xff1a;递归 struct TreeNode* buildTree(int* preorder, int preorderSize, int* ino…...

DeepSeek-OCR-2开发者案例:集成至RAG系统实现图文混合检索增强

DeepSeek-OCR-2开发者案例&#xff1a;集成至RAG系统实现图文混合检索增强 1. 项目背景与需求 最近在做一个智能文档问答系统&#xff0c;客户的需求很明确&#xff1a;他们有很多PDF文档&#xff0c;里面既有文字又有图片&#xff0c;用户提问时&#xff0c;系统要能同时理解…...

移动端视频适配难题:xgplayer的CSS全屏模式实战指南(含16:9与9:16适配技巧)

移动端视频适配难题&#xff1a;xgplayer的CSS全屏模式实战指南&#xff08;含16:9与9:16适配技巧&#xff09; 在移动端视频播放场景中&#xff0c;屏幕比例适配一直是开发者面临的棘手问题。传统全屏模式在处理非常规比例视频&#xff08;如竖屏9:16内容&#xff09;时往往表…...

杭州做生成式引擎优化的服务公司有哪些?

杭州做生成式引擎优化的服务公司有哪些&#xff1f; 一、行业背景&#xff1a;GEO已成为AI时代企业增长的核心基建 生成式引擎优化&#xff08;GEO&#xff0c;Generative Engine Optimization&#xff09;&#xff0c;是针对大语言模型的检索逻辑与回答规则&#xff0c;优化企…...

【信号处理】基于预设性能的无模型自适应分数阶快速终端滑模控制在MIMO非线性系统中的研究附matlab代码

✅作者简介&#xff1a;热爱科研的Matlab仿真开发者&#xff0c;擅长毕业设计辅导、数学建模、数据处理、建模仿真、程序设计、完整代码获取、论文复现及科研仿真。&#x1f34e; 往期回顾关注个人主页&#xff1a;Matlab科研工作室&#x1f447; 关注我领取海量matlab电子书和…...

[认知计算] 神经网络架构:从生物启发的神经元到现代激活函数演进

1. 从生物神经元到人工神经元的数学抽象 1943年&#xff0c;麦卡洛克和皮茨在论文《神经活动中内在思想的逻辑演算》中首次提出用数学模型模拟生物神经元。这个看似简单的想法&#xff0c;彻底改变了人类对智能的认知方式。生物神经元由树突、细胞体和轴突三部分组成&#xff1…...

如何用torchtext快速构建文本分类模型?5分钟上手RoBERTa与T5实战教程

如何用torchtext快速构建文本分类模型&#xff1f;5分钟上手RoBERTa与T5实战教程 【免费下载链接】text Models, data loaders and abstractions for language processing, powered by PyTorch 项目地址: https://gitcode.com/gh_mirrors/te/text 想要在PyTorch生态中快…...

EdB Prepare Carefully:定制你的RimWorld完美开局体验

EdB Prepare Carefully&#xff1a;定制你的RimWorld完美开局体验 【免费下载链接】EdBPrepareCarefully EdB Prepare Carefully, a RimWorld mod 项目地址: https://gitcode.com/gh_mirrors/ed/EdBPrepareCarefully 是否厌倦了RimWorld随机生成的殖民者团队带来的不确定…...

测试用例设计-XMind

&#x1f680; 一、XMind 用例设计核心思路&#x1f449; 和传统Excel不同&#xff0c;XMind强调&#xff1a;以“功能模块”为主干 以“用户场景”为分支 以“测试点”为叶子节点&#x1f449; 本质结构&#xff1a;模块 → 场景 → 用例点 → 具体测试数据/预期&#x1f4cc;…...

SRS + FFmpeg WebRTC 循环推流环境搭建

SRS FFmpeg WebRTC 循环推流环境搭建指南 本指南介绍如何使用 Docker Compose 快速搭建一个基于 SRS (Simple Realtime Server) 的流媒体测试环境。 推流协议&#xff1a;RTMP (FFmpeg 模拟推流)拉流协议&#xff1a;WebRTC (低延迟播放)特性&#xff1a;视频循环播放、不保存…...

OpenClaw多模态飞书助手:Qwen3-VL:30B实战详解

OpenClaw多模态飞书助手&#xff1a;Qwen3-VL:30B实战详解 1. 为什么需要多模态飞书助手&#xff1f; 去年夏天&#xff0c;我负责一个跨部门协作项目时&#xff0c;每天要处理上百条飞书消息。最头疼的是同事发来的各种截图——有的是数据报表需要整理&#xff0c;有的是会议…...