Unity（四十八）：Unity与Web双向交互
效果
游戏对象绑定脚本
游戏脚本源码
using System.Collections;
using System.Collections.Generic;
using UnityEngine;public class Tent : MonoBehaviour
{public Camera camera;// Start is called before the first frame updatevoid Start(){}// Update is called once per frame[System.Obsolete]void Update(){SendUnityMessage();}/// <summary>/// 发送数据到Web端/// </summary>[System.Obsolete]public void SendUnityMessage() {// 当前游戏对象的位置Vector3 worldPoint = transform.position;// 转换为屏幕位置Vector3 screenPoint = camera.WorldToScreenPoint(worldPoint);// w屏宽, h屏高, x位置, y位置Vector4 position = new Vector4(Screen.width, Screen.height, screenPoint.x, Screen.height - screenPoint.y);// 发送到Web端Application.ExternalCall("updatePosition2Web", transform.gameObject.name, position);}/// <summary>/// 接收来自Web的传参/// </summary>/// <param name="message">传参信息</param>public void ReceiveWebMessage(string message) {transform.position = Vector3.zero;Debug.Log(message);}
}
打包为Web应用
修改打包后的HTML源码
* {margin: 0;padding: 0;box-sizing: border-box;
}html,
body {position: relative;width: 100%;height: 100%;overflow: hidden;
}#unity-canvas,
#unity-svg {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100%;height: 100%;
}
<!DOCTYPE html>
<html lang="en-us"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Unity WebGL Player</title><link rel="shortcut icon" href="TemplateData/favicon.ico"><link rel="stylesheet" href="TemplateData/style.css"><link rel="manifest" href="manifest.webmanifest">
</head><body><canvas id="unity-canvas" width=900 height=600 tabindex="-1"></canvas><svg id="unity-svg"><text id="svg-text"></text></svg></div><script src="./js/d3@7.js"></script><script>var canvas = document.querySelector("#unity-canvas");let unity = null;var buildUrl = "Build";var loaderUrl = buildUrl + "/XXXXXX.loader.js";var config = {dataUrl: buildUrl + "/XXXXXX.data.unityweb",frameworkUrl: buildUrl + "/XXXXXX.framework.js.unityweb",codeUrl: buildUrl + "/XXXXXX.wasm.unityweb",streamingAssetsUrl: "StreamingAssets",companyName: "DefaultCompany",productName: "XXXXXX",productVersion: "0.1",};var script = document.createElement("script");script.src = loaderUrl;script.onload = () => {createUnityInstance(canvas, config, (progress) => {console.log('progress', progress);}).then((unityInstance) => {unity = unityInstance;}).catch((message) => {alert(message);});};document.body.appendChild(script);/*** 获取游戏对象相对于屏幕的位置* @param name 游戏对象名称* @param position 位置信息*/function updatePosition2Web(name, position) {const [w, h, x, y] = position.replace(/[()\s]/g, '').split(',');const svg = d3.select('#unity-svg').attr('viewBox', [0, 0, w, h]);d3.select('#svg-text').text(position).attr('x', x).attr('y', y).attr('fill', 'red').attr('font-size', 30).on('click', e => {console.log(name, unity);unity.SendMessage(name, "ReceiveWebMessage", "发送消息到unity!!!")});}</script>
</body></html>
相关文章：
Unity（四十八）：Unity与Web双向交互
效果 游戏对象绑定脚本 游戏脚本源码 using System.Collections; using System.Collections.Generic; using UnityEngine;public class Tent : MonoBehaviour {public Camera camera;// Start is called before the first frame updatevoid Start(){}// Update is called once…...
web前端--网页练习
html代码： <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>小米</title><!-- 引…...
信息安全入门——网络安全控制
目录 前言信息安全入门：网络安全控制基础1. 用户识别技术：确认你是谁2. 访问控制技术：定义你能做什么3. 访问控制列表（ACL）：精细的权限管理4. 漏洞控制：防范未然5. 入侵检测系统（IDS…...
跟着鸟儿学飞行？扑翼机器人的感知秘籍
大家好！今天来了解一篇扑翼机器人的研究——《Avian-inspired embodied perception in biohybrid flapping-wing robotics》发表于《Nature Communications》。在广阔天空中，鸟类凭借精妙翅膀结构与敏锐感知自由翱翔，这一直吸引着科学家探索其…...
Python画笔案例-093 绘制 彩虹图
1、绘制 彩虹图 通过 python 的turtle 库绘制 彩虹图，如下图： 2、实现代码 绘制 彩虹图，以下为实现代码： """彩虹图.py """ import turtledef draw_semi_circle(radius):"""画半圆函数"""turtle...
【数据结构】贪心算法：决策的艺术
贪心算法（Greedy Algorithm）是一类在每一步选择中都采取局部最优解的方法，希望最终能够达到全局最优解。通俗地说，贪心算法的思想就是“每一步都尽量做出最好的选择”，以期望整个过程的最终结果也达到最优状态。贪心算…...
Linux LVS详解
LVS（Linux Virtual Server）即Linux虚拟服务器，是一个基于Linux操作系统的高性能、可扩展的负载均衡器。以下是对LVS的详细介绍： 一、简介 LVS项目由章文嵩博士在1998年5月发起，是中国国内最早出现的自由软件项目之一…...
LabVIEW显微镜自动对焦系统
在生物医学研究中，显微镜图像的清晰度对于细胞分析非常重要。传统的手动对焦方法容易受到人为因素的影响，因此开发了一种自动对焦技术，以提高图像采集的准确性和效率。 自动对焦方法概述 该系统结合了图像清晰度评估和一维功能优化ÿ…...
基于IP的真实地址生成器
ip-geoaddress-generator 是一个基于 Web 的在线应用程序，能够根据 IP 地址生成真实的随机地址信息。通过多个 API 获取位置数据和随机用户信息，该工具为用户提供了完整的虚拟身份。它由 Next.js 和 Radix UI 构建，具备自动检测当前 IP 地址和…...
下面程序头的三个import语句可以合并或简化么？
下面程序头的三个import语句可以合并或简化么？ from tkinter.simpledialog import askinteger from tkinter import * from tkinter import messagebox ——是的，三个import语句可以合并为一个。 合并后的import语句如下所示： from tkinte…...
深度学习--CNN实现猫狗识别二分类(附带下载链接, 长期有效)
1. 代码实现(包含流程解释) 样本量: 8005 # # 1.导入数据集(加载图片)数据预处理# 进行图像增强, 通过对图像的旋转 ,缩放,剪切变换, 翻转, 平移等一系列操作来生成新样本, 进而增加样本容量, # 同时对图片数值进行归一化[0:1] from tensorflow.keras.preprocessing.image …...
Depcheck——专门用于检测 JavaScript 和 Node.js 项目中未使用依赖项的工具
文章目录 Depcheck 是什麽核心功能📚检测未使用的依赖🐛检测缺失的依赖✨支持多种文件类型🌍可扩展性 安装与使用1. 安装 Depcheck2. 使用 Depcheck Depcheck 的应用总结项目源码： Depcheck 是什麽 来看一个常见错误场景…...
前端构建工具vite的优势
1. 极速冷启动 Vite 使用原生 ES 模块 (ESM) 在开发环境下进行工作。相比于传统构建工具需要打包所有的文件，Vite 只在浏览器请求模块时动态加载所需的文件。无打包冷启动：无需预先打包，项目启动非常快，尤其对于大型项目效果更明…...
hive查询语句
1.基本语法 SELECT [ALL | DISTINCT]select_expr, select_expr, ... FROM table_reference [WHERE where_condition] [GROUP BYcol_list] [HAVING where_condition] [ORDER BYcol_list] [CLUSTER BYcol_list | [DISTRIBUTE BY col_list] [SORT BY col_list] ] [LIMIT number] …...
【AIGC】2024-ECCV-ControlNet++：通过有效的一致性反馈改进条件控制
2024-ECCV-ControlNet: Improving Conditional Controls with Efficient Consistency Feedback ControlNet：通过有效的一致性反馈改进条件控制摘要1. 引言2. 相关工作2.1 基于扩散的生成模型2.2 可控的文本到图像扩散模型2.3 语言和视觉奖励模型 3. 方法3.1. 初步3.…...
Mysql5.7变为GreatSQL 8.0.32-25过程中，SQL语句报错及解决方案
考虑兼容国产化数据库，现需要将Mysql5.7变为GreatSQL，在执行部分sql时，发现在Mysql5.7无报错，在GreatSQL有报错，在此记录一下遇到的几个错误。 1.ERROR 1231 (NO_AUTO_CREATE_USER) 1.1.报错提示 ERROR 1231 (42000…...
Qt 使用QAxObject将QTableView数据导出到Excel表格
这是我记录Qt学习过程的第6篇心得文章，主要是方便自己编写的应用程序导出Excel数据的，走了不少弯路直接上代码。 实现代码： //人员信息导出 ui->pbtn2->setEnabled(false); // 打开文件对话框，选择 excel文件 QString fil…...
fastGpt
参考本地部署FastGPT使用在线大语言模型 1 rockylinx 1 ollama安装 在rockylinux中安装的，ollama由1.5G，还是比较大，所有采用在windows下下载，然后安装的方式，linux安装 tar -C /usr -xzf ollama-linux-amd64.tgz #…...
如何全方位应对服务可用性的挑战
在数字化转型的浪潮中，运维团队正站在企业IT架构的核心位置，面对着前所未有的挑战。服务响应时间和失败率，作为衡量服务质量的重要指标，一直备受关注。然而，在追求这两项指标优化的同时，运维团队还需关注其…...
二进制方式部署k8s集群
目标任务： 1、Kubernetes集群部署架构规划 2、部署Etcd数据库集群 3、在Node节点安装Docker 4、部署Flannel网络插件 5、在Master节点部署组件（api-server,schduler,controller-manager） 6、在Node节点部署组件（kubelet,kube-proxy） 7、查看集群状态 8、运行⼀个测…...
React hook之useRef
React useRef 详解 useRef 是 React 提供的一个 Hook，用于在函数组件中创建可变的引用对象。它在 React 开发中有多种重要用途，下面我将全面详细地介绍它的特性和用法。 基本概念 1. 创建 ref const refContainer useRef(initialValue);initialValu…...
从WWDC看苹果产品发展的规律
WWDC 是苹果公司一年一度面向全球开发者的盛会，其主题演讲展现了苹果在产品设计、技术路线、用户体验和生态系统构建上的核心理念与演进脉络。我们借助 ChatGPT Deep Research 工具，对过去十年 WWDC 主题演讲内容进行了系统化分析，形成了这份…...
k8s从入门到放弃之Ingress七层负载
k8s从入门到放弃之Ingress七层负载 在Kubernetes（简称K8s）中，Ingress是一个API对象，它允许你定义如何从集群外部访问集群内部的服务。Ingress可以提供负载均衡、SSL终结和基于名称的虚拟主机等功能。通过Ingress，你可…...
通过Wrangler CLI在worker中创建数据库和表
官方使用文档：Getting started Cloudflare D1 docs 创建数据库 在命令行中执行完成之后，会在本地和远程创建数据库： npx wranglerlatest d1 create prod-d1-tutorial 在cf中就可以看到数据库： 现在，您的Cloudfla…...
理解 MCP 工作流：使用 Ollama 和 LangChain 构建本地 MCP 客户端
🌟 什么是 MCP？ 模型控制协议 (MCP) 是一种创新的协议，旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议，它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...
linux arm系统烧录
1、打开瑞芯微程序 2、按住linux arm 的 recover按键 插入电源 3、当瑞芯微检测到有设备 4、松开recover按键 5、选择升级固件 6、点击固件选择本地刷机的linux arm 镜像 7、点击升级 （忘了有没有这步了 估计有） 刷机程序 和 镜像 就不提供了。要刷的时…...
页面渲染流程与性能优化
页面渲染流程与性能优化详解（完整版） 一、现代浏览器渲染流程（详细说明） 1. 构建DOM树 浏览器接收到HTML文档后，会逐步解析并构建DOM（Document Object Model）树。具体过程如下： (…...
C++.OpenGL （10/64）基础光照（Basic Lighting）
基础光照（Basic Lighting） 冯氏光照模型（Phong Lighting Model） #mermaid-svg-GLdskXwWINxNGHso {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-GLdskXwWINxNGHso .error-icon{fill:#552222;}#mermaid-svg-GLd…...
BCS 2025｜百度副总裁陈洋：智能体在安全领域的应用实践
6月5日，2025全球数字经济大会数字安全主论坛暨北京网络安全大会在国家会议中心隆重开幕。百度副总裁陈洋受邀出席，并作《智能体在安全领域的应用实践》主题演讲，分享了在智能体在安全领域的突破性实践。他指出，百度通过将安全能力…...
大数据学习（132）-HIve数据分析
🍋🍋大数据学习🍋🍋 🔥系列专栏： 👑哲学语录: 用力所能及，改变世界。 💖如果觉得博主的文章还不错的话，请点赞👍收藏⭐️留言Ǵ…...