x3dom:1.导入模型并显示
2024-05-12 18:40:11
html支持直接使用javascrip的代码，以及x3d的代码，其中导入x3d模型将会非常easy
<Inline nameSpaceName="axes1" mapDEFToID="true" url="axesSmall.x3d" />
- nameSpaceName 代表的为这个模型起的名字
- url表示导入的x3d模型从哪里来
先上效果图：
源代码：
<html>
<head><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>My first X3DOM page</title><script type='text/javascript' src='https://www.x3dom.org/download/x3dom.js'> </script><link rel='stylesheet' type='text/css' href='https://www.x3dom.org/download/x3dom.css'/>
</head><body>
<h1>使用Inline函数进行导入模型</h1>
<script>function redNose(){//此处的getElementById为替换内容if(document.getElementById('Deer__MA_Nose').getAttribute('diffuseColor')!= '1 0 0')document.getElementById('Deer__MA_Nose').setAttribute('diffuseColor', '1 0 0');elsedocument.getElementById('Deer__MA_Nose').setAttribute('diffuseColor', '0 0 0');}
</script><p>此处显示有三个区域：第一个是可以交互移动的三维模型，第二个是不可交互移动模型，第三个是鹿的模型
</p><!--TODO 测试 坐标系加标签-->
<x3d showStat="true" width='500px' height='400px'><scene><viewpoint position="-1.94639 1.79771 -2.89271" orientation="0.03886 0.99185 0.12133 3.75685"></viewpoint><Inline nameSpaceName="axes1" mapDEFToID="true" url="axesSmall.x3d" /></scene>
</x3d><!--TODO 测试 不可互动坐标系-->
<x3d width='500px' height='400px'><scene><!--不可互动坐标系--><navigationInfo type='"NONE" "ANY"'></navigationInfo><viewpoint position="-1.94639 1.79771 -2.89271" orientation="0.03886 0.99185 0.12133 3.75685"></viewpoint><Inline nameSpaceName="axes2" mapDEFToID="true" url="axesSmall.x3d" /></scene>
</x3d><!--TODO 测试 其他图形-->
<x3d id="x3domOrientationSceneView" width='500px' height='400px'><scene><navigationInfo type='"TURNTABLE" "ANY"'></navigationInfo><viewpoint position="0.0 0.0 2.95"></viewpoint><inline onclick='redNose();'url="Deer2.x3d" mapDEFToID="true" namespaceName="orientationBox"></inline></scene>
</x3d></body>
</html>
至于x3d的模型，从哪儿找， 这里提供一个简单的x3d模型，你将该内容拷贝进txt，然后后缀命名为x3d即可。
axesSmall.x3d
<X3D><scene><group><!-- X arrow and label --><Shape isPickable="false" DEF="AXIS_LINE_X"><IndexedLineSet index="0 1 -1"><Coordinate point="0 0 0.001, 1 0 0.001" color="1 0 0, 1 0 0"></Coordinate></IndexedLineSet><Appearance DEF='Red'><Material diffuseColor="0 0 0" emissiveColor='1 0 0'></Material></Appearance></Shape><Transform translation='1 0 0'><Transform rotation='0 0 1 -1.57079632679'><Shape isPickable="false" DEF="AXIS_ARROW_X"><Cone DEF='ArrowCone' bottomRadius='.10' height='0.5' subdivision="16"></Cone><Appearance USE='Red'></Appearance></Shape></Transform><Transform rotation='1 0 0 1.57079632679'><Billboard><Shape isPickable="false" DEF="AXIS_LABEL_X"><Text string="X" solid="false"><FontStyle size="0.6"></FontStyle></Text><Appearance USE='Red'></Appearance></Shape></Billboard></Transform></Transform><!-- Y arrow and label --> <Shape isPickable="false" DEF="AXIS_LINE_Y"><IndexedLineSet index="0 1 -1"><Coordinate point="0 0 0.001, 0 1 0.001" color="0 1 0, 0 1 0"></Coordinate></IndexedLineSet><Appearance DEF='Green'><Material diffuseColor="0 0 0" emissiveColor='0 1 0'></Material></Appearance></Shape><Transform translation='0 1 0'><Shape isPickable="false" DEF="AXIS_ARROW_Y"><Cone USE='ArrowCone'></Cone><Appearance USE='Green'></Appearance></Shape><Transform rotation='1 0 0 1.57079632679'><Billboard><Shape isPickable="false" DEF="AXIS_LABEL_Y"><Text string="Y" solid="false"><FontStyle size="0.6"></FontStyle></Text><Appearance USE='Green'></Appearance></Shape></Billboard></Transform></Transform><!-- Z arrow and label --><Shape isPickable="false" DEF="AXIS_LINE_Z"><IndexedLineSet index="0 1 -1"><Coordinate point="0 0 0.001, 0 0 1" color="0 0 1, 0 0 1"></Coordinate></IndexedLineSet><Appearance DEF='Blue'><Material diffuseColor="0 0 0" emissiveColor='0 0 1'></Material></Appearance></Shape><Transform translation='0 0 1'><Transform rotation='1 0 0 1.57079632679'><Shape isPickable="false" DEF="AXIS_ARROW_Z"><Cone USE='ArrowCone'></Cone><Appearance USE='Blue'></Appearance></Shape><Billboard><Shape isPickable="false" DEF="AXIS_LABEL_Z"><Text string="Z" solid="false"><FontStyle size="0.6"></FontStyle></Text><Appearance USE='Blue'></Appearance></Shape></Billboard></Transform></Transform></group></scene>
</X3D>
x3dom:1.导入模型并显示相关推荐
- C4D导入模型不显示
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言 一.解决流程 1.首先设置"视图修剪"状态为"极大" 2.方法二: 前言 C4 ...
- Adams导入SW模型不显示
Adams导入SW模型不显示 将模型在SOLIDWORKS中绘制完成后导入到Adams进行运动仿真,SW的模型在树中有显示,但是在界面上怎么都看不到,应该如何处理呢? 导入SW模型到Adams中,首先 ...
- unity 批量导入模型工具_零基础的Unity图形学笔记3：使用多模型UV与优化模型导出...
前文所说,贴图多UV,直接命名对应贴图就可以. 模型的多套UV,则需要在3DMAX里编辑. 这篇文章主要解决两个问题: 如何正确使用多模型UV? 从3DMAX导出,到shader使用 如何优化模型导出 ...
- matlab 三维模型怎么导入ansys,Ansys怎么导入模型？Ansys导入模型的方法
Ansys是一款非常好用的CAE工具之一,它提供了一个完整的实体建模及网格划分工具,那你知道Ansys怎么导入模型的吗?接下来我们一起往下看看Ansys导入模型的方法吧. 方法步骤 1.这里小编以常用 ...
- 昨天学会2件事，一件是multisim 添加自定义模型或导入模型文件，包括opa695和9013等三极管
昨天学会2件事,一件是multisim 添加自定义模型或导入模型文件,包括opa695和9013等三极管,嵌入式的研究也有所进步.其中opa695需要导入新加入的模型文件,文件下载好了,TI官网的,但 ...
- 网易我的世界导入皮肤服务器显示吗,网易我的世界导入皮肤方法 | 手游网游页游攻略大全...
发布时间:2016-03-12 怎么换皮肤?下面99单机小编就为你带来高玩贡献的技巧心得攻略-- 猜你喜欢: 饥荒快速解锁英雄的技巧 饥荒怎么解锁英雄 城市天际线盗版使用MOD的方法教程指引 标签: ...
- 从Poser中输出模型与向3ds Max导入模型
Poser与其他3D软件,如3ds Max.Maya.LightWave等可以进行数据交换,这也是在制作模型成品时不可缺少的重要步骤,Poser既可以将其他3D软件制作的模型作为道具导入Poser,也 ...
- SIMetrix教程-005.SIMetrix导入第三方库；SIMetrix导入模型
各种仿真软件能否导入.怎么导入第三方库是个永恒的话题. SIMetrix安装时如果选择的是默认路径,那么软件自带库文件路径一般是C:\Program Files\SIMetrix830\sup ...
- unity界面介绍及导入模型
unity界面介绍 排版 一般刚打开unity默认是如下界面,可以自己拖拽为自己喜欢的布局,也可以使用右上角的Layout中来选择布局.目前显示出来的只是最常用的界面,还有很多可以在window中 ...
最新文章
- c语言符号txt下载,c语言中符号含义.txt
- android volley post 参数,android – 使用Volley POST传递参数
- 2021 年，Java 开发者值得学习的 13 项技能
- 密码学专题 鉴别协议|实际应用的混合协议
- 2021 年前端趋势预测
- QQ音乐：React v16 新特性实践
- Java中引入泛型的好处
- 08年新年快乐 :-)
- Huber损失最小化学习法
- php 四级联动插件,JavaScript_jQuery实现的多选框多级联动插件，jQuery 实现的多选框联动插件 - phpStudy...
- 实验五 存储管理实验
- 解决Mac上“文本编码Unicode(UTF-8)“不适用的方法
- 1. paip.discuz X2.5 积分（金钱）功能API总结
- 30款各大论坛的XP
- 2021-7-19-OpenStack基础知识学习
- oracle 发的邮件qq,python基于SMTP发送QQ邮件
- 蓝牙打印 设置打印样式_Android蓝牙打印机，带你真正了解各种打印格式
- Eclipse TPTP 分析程序性能
- vue3+vite UC浏览器兼容
- 推特开发者账号 获取推文的视频链接