CN111475249B - 一种基于web端四方连接技术的三维展示方法 - Google Patents
一种基于web端四方连接技术的三维展示方法 Download PDFInfo
- Publication number
- CN111475249B CN111475249B CN202010330052.0A CN202010330052A CN111475249B CN 111475249 B CN111475249 B CN 111475249B CN 202010330052 A CN202010330052 A CN 202010330052A CN 111475249 B CN111475249 B CN 111475249B
- Authority
- CN
- China
- Prior art keywords
- model
- display method
- dimensional display
- software
- map
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 14
- RKTYLMNFRDHKIL-UHFFFAOYSA-N copper;5,10,15,20-tetraphenylporphyrin-22,24-diide Chemical group [Cu+2].C1=CC(C(=C2C=CC([N-]2)=C(C=2C=CC=CC=2)C=2C=CC(N=2)=C(C=2C=CC=CC=2)C2=CC=C3[N-]2)C=2C=CC=CC=2)=NC1=C3C1=CC=CC=C1 RKTYLMNFRDHKIL-UHFFFAOYSA-N 0.000 title claims abstract description 8
- 239000000463 material Substances 0.000 claims abstract description 14
- 238000010422 painting Methods 0.000 claims abstract description 4
- 238000012360 testing method Methods 0.000 claims abstract description 4
- 238000012800 visualization Methods 0.000 claims abstract description 4
- 238000013461 design Methods 0.000 claims description 14
- 230000003993 interaction Effects 0.000 claims description 6
- 238000013507 mapping Methods 0.000 claims description 5
- 230000006399 behavior Effects 0.000 claims description 3
- 230000009286 beneficial effect Effects 0.000 abstract description 2
- 238000012790 confirmation Methods 0.000 abstract 1
- 239000004744 fabric Substances 0.000 description 2
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Human Computer Interaction (AREA)
- Data Mining & Analysis (AREA)
- Processing Or Creating Images (AREA)
Abstract
本发明公开了一种基于WEB端四方连接技术的三维展示方法，包括以下步骤：A：利用3D建模软件创建产品的3D模型；B：按照平展UV的方式展开UV，在三维软件中自绘格子纹理；C：将各个模型及材质文件导入threeJS语言的开发软件中，通过自制的编译程序代码实现UV框意外的纹理能够正常重复显示，之后将已经制作完成第四方连续贴图和模型的UV信息；D：利用threeJS语言的开发软件，通过模型灯光、贴图材质资源文件、场景资源的相关信息和材质资源的相关信息；E：通过WEB端窗口，测试四方连续贴图是否能正常表现；F：在确认WEB端可视化无任何问题。本发明的有益效果是：能够用较少的资源和较短的时间体现重复性质的纹理，真实还原服装对条对缝。
Description
技术领域
本发明涉及WEB端计算机三维技术领域，具体为一种基于WEB端四方连接技术的三维展示方法。
背景技术
四方连续是出在装饰画种的,有单独纹样,二方连续,四方连续,适合纹样 一般四方连续是四个相同的图案,按照一定规则排列起来的。可以中心线对称排列,水平线对称排列,中心点排列等等，目前市面上的四方连续技术，在面对格子或者条纹纹理时无法和真实服装匹配。
发明内容
本发明的目的在于提供一种基于WEB端四方连接技术的三维展示方法，以解决上述背景技术中提出的问题。
为实现上述目的，本发明提供如下技术方案：一种基于WEB端四方连接技术的三维展示方法，包括以下步骤：
A：利用3D建模软件创建产品的3D模型；
B：按照平展UV的方式展开UV，在三维软件中自绘格子纹理，调整UV在贴图中的摆放位置，使得格子纹理对条对缝，从而保证UV大小的一致；
C：将各个模型及材质文件导入threeJS语言的开发软件中，通过自制的编译程序代码实现UV框以外的纹理能够正常重复显示，之后将已经制作完成四方连续贴图和模型的UV信息并上传到互联网服务器中存储；
D：利用threeJS语言的开发软件，通过模型灯光、贴图材质资源文件、场景资源的相关信息和材质资源的相关信息，进行用户交互界面的设计及脚本代码的设计；
E：通过WEB端窗口，测试四方连续贴图是否能正常表现，如若发现不能正常显示，则返回C步骤检查；
F：在确认WEB端可视化无任何问题，将所有文件上传服务器，通过外网即可访问四方连续贴图模型。
优选的，所述步骤C中自制编译程序代码的相连规则为上下相连，左右相连，向周围重复扩展。
优选的，所述步骤D中，设计方案根据不同方位，设计多个UI界面的缩略图示，并通过模拟用户行为设计出合理的交互，通过threeJS代码并编译成基于WER端可查看的页面，使得四方连续贴图可视化。
与现有技术相比，本发明的有益效果是：
1、通过四方连续贴图还原布料真实感。YV信息使其能够在模型上显示
2、通过合理的布局整个界面，使其模型和UI表现最优化；
3、用较少的资源和较短的时间体现重复性质的纹理，真实还原服装对条对缝。
附图说明
为了更清楚地说明本发明实施例的技术方案，下面将对实施例描述所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1为本发明步骤流程图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
请参阅图1，本发明提供一种技术方案：一种基于WEB端四方连接技术的三维展示方法，包括以下步骤：
A：利用3D建模软件创建产品的3D模型；
B：按照平展UV的方式展开UV，在三维软件中自绘格子纹理，调整UV在贴图中的摆放位置，使得格子纹理对条对缝，从而保证UV大小的一致；
C：将各个模型及材质文件导入threeJS语言的开发软件中，通过自制的编译程序代码实现UV框以外的纹理能够正常重复显示，之后将已经制作完成四方连续贴图和模型的UV信息并上传到互联网服务器中存储；
D：利用threeJS语言的开发软件，通过模型灯光、贴图材质资源文件、场景资源的相关信息和材质资源的相关信息，进行用户交互界面的设计及脚本代码的设计；
E：通过WEB端窗口，测试四方连续贴图是否能正常表现，如若发现不能正常显示，则返回C步骤检查；
F：在确认WEB端可视化无任何问题，将所有文件上传服务器，通过外网即可访问四方连续贴图模型。
优选的，所述步骤C中自制编译程序代码的相连规则为上下相连，左右相连，向周围重复扩展，其优点是，通过四方连续贴图还原布料真实感。YV信息使其能够在模型上显示。
优选的，所述步骤D中，设计方案根据不同方位，设计多个UI界面的缩略图示，并通过模拟用户行为设计出合理的交互，通过threeJS代码并编译成基于WER端可查看的页面，使得四方连续贴图可视化，其优点是，通过合理的布局整个界面，使其模型和UI表现最优化。
本说明书的描述中，参考术语“一个实施例”、“示例”、“具体示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施例或示例中。在本说明书中，对上述术语的示意性表述不一定指的是相同的实施例或示例。而且，描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施例或示例中以合适的方式结合。
以上公开的本发明优选实施例只是用于帮助阐述本发明。优选实施例并没有详尽叙述所有的细节，也不限制该发明仅为所述的具体实施方式。显然，根据本说明书的内容，可作很多的修改和变化。本说明书选取并具体描述这些实施例，是为了更好地解释本发明的原理和实际应用，从而使所属技术领域技术人员能很好地理解和利用本发明。本发明仅受权利要求书及其全部范围和等效物的限制。
Claims (3)
1.一种基于WEB端四方连接技术的三维展示方法，其特征在于，包括以下步骤：
A：利用3D建模软件创建产品的3D模型；
B：按照平展UV的方式展开UV，在三维软件中自绘格子纹理，调整UV在贴图中的摆放位置，使得格子纹理对条对缝，从而保证UV大小的一致；
C：将各个模型及材质文件导入threeJS语言的开发软件中，通过自制的编译程序代码实现UV框以外的纹理正常重复显示，之后将已经制作完成四方连续贴图和模型的UV信息并上传到互联网服务器中存储；
D：利用threeJS语言的开发软件，通过模型灯光、贴图材质资源文件、场景资源的相关信息和材质资源的相关信息，进行用户交互界面的设计及脚本代码的设计；
E：通过WEB端窗口，测试四方连续贴图是否能正常表现，如若发现不能正常显示，则返回C步骤检查；
F：在确认WEB端可视化无任何问题，将所有文件上传服务器，通过外网即可访问四方连续贴图模型。
2.根据权利要求1所述的一种基于WEB端四方连接技术的三维展示方法，其特征在于：所述步骤C中自制编译程序代码的相连规则为上下相连，左右相连，向周围重复扩展。
3.根据权利要求1所述的一种基于WEB端四方连接技术的三维展示方法，其特征在于：所述步骤D中，设计方案根据不同方位，设计多个UI界面的缩略图示，并通过模拟用户行为设计出合理的交互，通过threeJS代码并编译成基于WEB端可查看的页面，使得四方连续贴图可视化。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010330052.0A CN111475249B (zh) | 2020-04-24 | 2020-04-24 | 一种基于web端四方连接技术的三维展示方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010330052.0A CN111475249B (zh) | 2020-04-24 | 2020-04-24 | 一种基于web端四方连接技术的三维展示方法 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN111475249A CN111475249A (zh) | 2020-07-31 |
| CN111475249B true CN111475249B (zh) | 2024-01-23 |
Family
ID=71761736
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010330052.0A Active CN111475249B (zh) | 2020-04-24 | 2020-04-24 | 一种基于web端四方连接技术的三维展示方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111475249B (zh) |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106777646A (zh) * | 2016-12-09 | 2017-05-31 | 浙江理工大学 | 一种织物的三维立体纹样设计方法 |
| CN106909640A (zh) * | 2017-02-16 | 2017-06-30 | 杭州新迪数字工程系统有限公司 | 基于webgl的三维模型轻量化展示技术 |
| CN109753334A (zh) * | 2019-01-14 | 2019-05-14 | 长沙眸瑞网络科技有限公司 | 一种基于WebGL的三维模型显示方法 |
| CN109919735A (zh) * | 2019-03-19 | 2019-06-21 | 江苏皓之睿数字科技有限公司 | 一种基于移动终端的3d模拟服饰搭配方法及系统 |
-
2020
- 2020-04-24 CN CN202010330052.0A patent/CN111475249B/zh active Active
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106777646A (zh) * | 2016-12-09 | 2017-05-31 | 浙江理工大学 | 一种织物的三维立体纹样设计方法 |
| CN106909640A (zh) * | 2017-02-16 | 2017-06-30 | 杭州新迪数字工程系统有限公司 | 基于webgl的三维模型轻量化展示技术 |
| CN109753334A (zh) * | 2019-01-14 | 2019-05-14 | 长沙眸瑞网络科技有限公司 | 一种基于WebGL的三维模型显示方法 |
| CN109919735A (zh) * | 2019-03-19 | 2019-06-21 | 江苏皓之睿数字科技有限公司 | 一种基于移动终端的3d模拟服饰搭配方法及系统 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN111475249A (zh) | 2020-07-31 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| JP5629705B2 (ja) | グラフィックスプロセッサ上の物理シミュレーション | |
| CN107393013B (zh) | 虚拟漫游文件生成、显示方法、装置、介质、设备和系统 | |
| CN111324965A (zh) | 一种基于云的通用参数化模型解析方法及设计系统 | |
| CN107256207B (zh) | 用于生成3d对象的设备和方法 | |
| CN106095437A (zh) | 用户界面从右到左rtl的布局方式的实现方法及装置 | |
| CN109493431B (zh) | 3d模型数据处理方法、装置及系统 | |
| CN103413344A (zh) | 3d帧动画实现方法、装置及终端 | |
| CN110796732A (zh) | 基于WebGL与C#的矿山三维展示方法 | |
| CN107357952A (zh) | 一种基于网络的自动装配及三维交互方法与系统 | |
| CN111429553B (zh) | 动画预览方法、装置、计算机设备和存储介质 | |
| CN115659445A (zh) | 一种基于Open Cascade的CAD模型在网页轻量化渲染显示的方法 | |
| CN113345048B (zh) | 地理信息图像编辑方法、装置及计算机设备 | |
| CN111475249B (zh) | 一种基于web端四方连接技术的三维展示方法 | |
| CN110007919A (zh) | 一种用于无人机自动机场的动态密度屏幕适配方法及系统 | |
| CN109712236A (zh) | 基于svg地图数据的三维可视化实现方法 | |
| CN117095121A (zh) | 基于浏览器的云原生三维模型处理方法、装置和电子设备 | |
| CN112001018A (zh) | 一种基于云渲染的高效虚拟仿真实验平台测试方法 | |
| CN107908393B (zh) | 一种scada实时模型画面的设计方法 | |
| LU502859B1 (en) | Three-dimensional display method based on web-side quadrilateral connection technology | |
| CN114817379A (zh) | 基于Qunee的配置项关系可视化方法、系统、设备及介质 | |
| CN107507265A (zh) | 基于三维渲染二维的模型贴图方法及装置 | |
| CN112182904A (zh) | 仿真材质模仿刷帖方法、装置和设备 | |
| CN111523161A (zh) | 一种基于BIM和Unity3d的3D物联网可视化人机交互方法 | |
| CN117454034B (zh) | 一种跨平台三维可视化方法、计算设备及存储介质 | |
| CN113222905B (zh) | 一种基于opensfm和three.js的结构损伤信息更新三维显示方法 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| TA01 | Transfer of patent application right |
Effective date of registration: 20220601 Address after: Room 719, unit 1, floor 7, building 2, yard 1, Longfa street, Daxing District, Beijing 102600 Applicant after: Beijing MIMU Digital Technology Co.,Ltd. Address before: 210001 8th floor, building a, China cloud computing base, Baixia Gaoxin Park, Qinhuai District, Nanjing City, Jiangsu Province Applicant before: JIANGSU HAOZHIRUI DIGITAL TECHNOLOGY CO.,LTD. |
|
| TA01 | Transfer of patent application right | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |