CN112330801A - 一种货架陈列设计方法 - Google Patents
一种货架陈列设计方法 Download PDFInfo
- Publication number
- CN112330801A CN112330801A CN202011210567.3A CN202011210567A CN112330801A CN 112330801 A CN112330801 A CN 112330801A CN 202011210567 A CN202011210567 A CN 202011210567A CN 112330801 A CN112330801 A CN 112330801A
- Authority
- CN
- China
- Prior art keywords
- shelf
- commodity
- design method
- model
- store
- 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.)
- Pending
Links
- 238000000034 method Methods 0.000 title claims abstract description 30
- 238000013461 design Methods 0.000 title claims abstract description 16
- 238000010367 cloning Methods 0.000 claims abstract description 4
- GNFTZDOKVXKIBK-UHFFFAOYSA-N 3-(2-methoxyethoxy)benzohydrazide Chemical compound COCCOC1=CC=CC(C(=O)NN)=C1 GNFTZDOKVXKIBK-UHFFFAOYSA-N 0.000 claims description 5
- FGUUSXIOTUKUDN-IBGZPJMESA-N C1(=CC=CC=C1)N1C2=C(NC([C@H](C1)NC=1OC(=NN=1)C1=CC=CC=C1)=O)C=CC=C2 Chemical compound C1(=CC=CC=C1)N1C2=C(NC([C@H](C1)NC=1OC(=NN=1)C1=CC=CC=C1)=O)C=CC=C2 FGUUSXIOTUKUDN-IBGZPJMESA-N 0.000 claims description 3
- 230000009286 beneficial effect Effects 0.000 description 10
- 238000010586 diagram Methods 0.000 description 2
- 238000006243 chemical reaction Methods 0.000 description 1
- 238000013079 data visualisation Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 230000002452 interceptive effect Effects 0.000 description 1
- 238000013507 mapping Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000009877 rendering Methods 0.000 description 1
- 238000012800 visualization Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T17/00—Three dimensional [3D] modelling, e.g. data description of 3D objects
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F30/00—Computer-aided design [CAD]
- G06F30/10—Geometric CAD
- G06F30/13—Architectural design, e.g. computer-aided architectural design [CAAD] related to design of buildings, bridges, landscapes, production plants or roads
Landscapes
- Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- Geometry (AREA)
- Theoretical Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Computer Hardware Design (AREA)
- Civil Engineering (AREA)
- Architecture (AREA)
- Software Systems (AREA)
- Computer Graphics (AREA)
- Structural Engineering (AREA)
- Computational Mathematics (AREA)
- Mathematical Analysis (AREA)
- Mathematical Optimization (AREA)
- Pure & Applied Mathematics (AREA)
- Evolutionary Computation (AREA)
- General Engineering & Computer Science (AREA)
- Processing Or Creating Images (AREA)
Abstract
本发明涉及一种货架陈列设计方法，包括以下步骤：a.上传卖场平面布局图，并设置比例尺，将货架放置到平面布局图中；b.提取平面布局图相对于卖场平面布局图指定位置的相对信息，所述相对信息包括坐标数据和旋转角度，计算出货架的真实坐标；c.根据货架坐标值计算所需卖场范围，绘制3D卖场地面模型；d.提取货架的HTML信息以获取货架尺寸，并绘制货架3D模型，将货架放置到指定坐标位置；e.提取货架平面的HTML信息，以获取商品尺寸及图片，计算商品在货架中的位置，绘制商品3D模型，并放置在货架3D模型的指定位置；f.根据货架层板纵深宽度及商品纵深宽度，计算商品最大陈列量并克隆商品补全空位；h.生成卖场场景。
Description
技术领域
本发明涉及计算机三维可视化技术领域，具体涉及一种基于WebGL的平面转3D的货架陈列设计方法。
背景技术
为了改善陈列标准化管理难，平面布局指导陈列不直观，需建立一个可交互的3D卖场场景进行指导陈列作业。目前，较多软件可进行3D场景生成，但均存在问题，需要借助相应软件，同时需要提前绘制要生成场景中的模型，即生成场景需人工提前绘制且需一定技术要求。同时直接绘制3D场景，难度较大，开发效率较低，生成模型固定，无法满足实时的卖场变化。WebGL的出现解决了上述问题，WebGL可以为HTML5 Canvas提供硬件3D加速渲染，这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了，还能创建复杂的导航和数据视觉化。但仍需提前绘制模型，有鉴于此，提供一种将平面转换为3D场景的方法显得尤为必要了。
发明内容
本发明针对现有技术中卖场货架3D模型生成困难的问题，提供一种基于WebGL的平面转3D的货架陈列设计方法。
本发明解决上述技术问题的技术方案如下：一种货架陈列设计方法，包括以下步骤：
a.上传卖场平面布局图，并设置比例尺，将货架放置到平面布局图中；
b.提取平面布局图相对于卖场平面布局图指定位置的相对信息，所述相对信息包括坐标数据和旋转角度，计算出货架的真实坐标；
c.根据货架坐标值计算所需卖场范围，绘制3D卖场地面模型；
d.提取货架的HTML信息以获取货架尺寸，并绘制货架3D模型，将货架放置到指定坐标位置；
e.提取货架平面的HTML信息，以获取商品尺寸及图片，计算商品在货架中的位置，绘制商品3D模型，并放置在货架3D模型的指定位置；
f.根据货架层板纵深宽度及商品纵深宽度，计算商品最大陈列量并克隆商品补全空位；
h.生成卖场场景。
本发明的有益效果是：本发明通过简单的卖场平面布局，实现自动生成卖场3D场景，更清晰的指导陈列作业，可提高用户体验及用户作业难度，降低人工作业成本。场景数据直接从平面HTML中计算提取，无需3D模型数据，操作简单。
在上述技术方案的基础上，本发明为了达到使用的方便以及装备的稳定性，还可以对上述的技术方案作出如下的改进：
进一步，所述步骤a中卖场平面布局图包括货架、货架层板和商品的尺寸信息及位置信息。
采用上述进一步技术方案的有益效果是：通过设置货架、货架层板和商品的尺寸信息，以便于生成相应的3D模型。
进一步，所述货架的位置信息包括货架摆放的相对位置。
采用上述进一步技术方案的有益效果是：通过设置货架与货架之间的相对位置信息，从而保证货架的布局合理，节省卖场空间。
进一步，在所述步骤f和步骤h之间还设有步骤g，所述步骤g:合并相同模型稳定帧率。
采用上述进一步技术方案的有益效果是：通过将相同模型合并可以提高该卖场模型整体的稳定性。
进一步，还包括步骤i:加入操作漫游场景。
采用上述进一步技术方案的有益效果是：通过加入操作漫游场景可模拟真实情况，以便于对不合理的地方进行修改，提高用户体验和卖场空间的利用率。
进一步，所述步骤a中通过拖拽的方式将货架放置在平面布局图中，以生成平面布局的HTML信息。
采用上述进一步技术方案的有益效果是：通过以拖拽的方式将货架放在平面布局图中，操作简单，降低了作业成本。
进一步，所述步骤b中的指定位置为卖场平面布局图的左顶点。
采用上述进一步技术方案的有益效果是：通过获取HTML中元素相对于顶点的水平坐标值和垂直坐标值，以及HTML中元素的旋转角度，以便于根据步骤a中的比例尺值计算出卖场中货架的实际位置及货架朝向。
进一步，所述步骤c中的货架坐标值包括水平坐标值和垂直坐标值。
采用上述进一步技术方案的有益效果是：通过获取货架的水平坐标值和垂直坐标值以便于计算出所需卖场面积的实际值。
进一步，所述步骤d中的货架尺寸包括货架的长、宽、高和货架层板相对货架底边的相对距离。
采用上述进一步技术方案的有益效果是：通过获取货架的长、宽、高尺寸以便于绘制货架的3D外形图，通过获取货架层板距离货架底边的相对位置以便于绘制货架层板在货架中的位置。
进一步，所述步骤e中商品在货架3D模型中的指定位置为：距货架左边顶点距离加上前一个绘制模型的距离之和。
采用上述进一步技术方案的有益效果是：通过将商品的位置设置为距货架左边顶点距离加上前一个绘制模型的距离之和，操作方便，计算简单。
附图说明
图1为卖场的3D布局图；
图2为卖场的平面布局图；
图3为货架和商品的平面图；
图4为货架和商品的3D图。
具体实施方式
以下结合附图对本发明的原理和特征进行描述，所举实例只用于解释本发明，并非用于限定本发明的范围。
如图1至图4所示，一种货架陈列设计方法，包括以下步骤：
a.上传卖场平面布局图至陈列平台中，并设置比例尺，将货架放置到平面布局图中；比例尺为所上传的平面布局图的物理像素即分辨率所对应的真实场景长宽，以毫米为准，物理像素的宽或高除以真实场景的宽或高。货架的真实长宽根据比例尺换算为HTML页面中的长宽。
平面布局图的生成过程：
①通过调用createShelf函数方法创建货架并设置货架的长、宽、高以及货架层板的位置；
②添加商品及配件到指定货架；
③调整卖场布局货架摆放的位置；
④根据调整平面布局生成卖场平面布局场景。
b.提取平面布局图相对于卖场平面布局图指定位置的相对信息，所述相对信息包括坐标数据和旋转角度，计算出货架的真实坐标；
通过调用getLayout函数方法计算出HTML标签中具有货架属性元素的相对于卖场平面布局图指定位置的坐标值，以及旋转角度；通过调用scaleConversion函数方法计算出货架的真实坐标。
c.根据货架坐标值计算所需卖场范围，绘制3D卖场地面模型；通过调用createFloor函数方法创建场景地面；
d.提取货架的HTML信息以获取货架尺寸，并绘制货架3D模型，将货架放置到指定坐标位置；
具体实现方法为：调用getShelf函数方法提取HTML标签中货架信息,调用convertShelf函数方法根据提取到的货架长宽高信息转换货架为3D模型，并根据步骤b获取到的坐标角度放置生成的3D货架模型至地面模型中；
e.提取货架平面的HTML信息，以获取商品尺寸及图片，计算商品在货架中的位置，绘制商品3D模型，并放置在货架3D模型的指定位置；
通过调用getShelfCommodity函数方法获取指定货架中的商品信息，包括商品的尺寸贴图以及相对位置，并调用converCommodity函数方法转换平面商品为3D模型,并根据相对位置放置于步骤d生成的3D货架中；
f.根据货架层板纵深宽度及商品纵深宽度，计算商品最大陈列量并通过调用supplementCommodity函数方法克隆商品补全空位；
h.生成卖场场景。
所述步骤a中卖场平面布局图包括货架、货架层板和商品的尺寸信息及位置信息。
所述货架的位置信息包括货架摆放的相对位置。
在所述步骤f和步骤h之间还设有步骤g，所述步骤g:调用mergedModel函数方法合并相同材质模型稳定帧率。
还包括步骤i:调用createRoam函数方法创建漫游点，加入操作漫游场景。
所述步骤a中通过拖拽的方式将货架放置在平面布局图中，以生成平面布局的HTML信息。拖拽形式放置商品到平面货架中，每个商品具有图片及尺寸，根据上述比例尺换算为平面中的尺寸。商品模型的面可采用纹理贴图绘制6面或所有面采用正面纹理。
所述步骤b中的指定位置为卖场平面布局图的左顶点。指定位置可以设置为其它的点，如设置为其它的点，HTML中元素的相对位置即为以此顶点获取的水平和垂直坐标值，然后再根据比例尺换算呈现实际效果。
所述步骤c中的货架坐标值包括水平坐标值和垂直坐标值。
所述步骤d中的货架尺寸包括货架的长、宽、高和货架层板相对货架底边的相对距离。
所述步骤e中商品在货架3D模型中的指定位置为：距货架左边顶点距离加上前一个绘制模型的距离之和。
以上所述仅为本发明的较佳实施例，并不用以限制本发明，凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。
Claims (10)
1.一种货架陈列设计方法，其特征在于，包括以下步骤：
a.上传卖场平面布局图，并设置比例尺，将货架放置到平面布局图中；
b.提取平面布局图相对于卖场平面布局图指定位置的相对信息，所述相对信息包括坐标数据和旋转角度，计算出货架的真实坐标；
c.根据货架坐标值计算所需卖场范围，绘制3D卖场地面模型；
d.提取货架的HTML信息以获取货架尺寸，并绘制货架3D模型，将货架放置到指定坐标位置；
e.提取货架平面的HTML信息，以获取商品尺寸及图片，计算商品在货架中的位置，绘制商品3D模型，并放置在货架3D模型的指定位置；
f.根据货架层板纵深宽度及商品纵深宽度，计算商品最大陈列量并克隆商品补全空位；
h.生成卖场场景。
2.根据权利要求1所述的货架陈列设计方法，其特征在于，所述步骤a中卖场平面布局图包括货架、货架层板和商品的尺寸信息及位置信息。
3.根据权利要求2所述的货架陈列设计方法，其特征在于，所述货架的位置信息包括货架摆放的相对位置。
4.根据权利要求1所述的货架陈列设计方法，其特征在于，在所述步骤f和步骤h之间还设有步骤g，
所述步骤g:合并相同模型稳定帧率。
5.根据权利要求1所述的货架陈列设计方法，其特征在于，还包括步骤i:加入操作漫游场景。
6.根据权利要求1所述的货架陈列设计方法，其特征在于，所述步骤a中通过拖拽的方式将货架放置在平面布局图中，以生成平面布局的HTML信息。
7.根据权利要求1所述的货架陈列设计方法，其特征在于，所述步骤b中的指定位置为卖场平面布局图的左顶点。
8.根据权利要求1所述的货架陈列设计方法，其特征在于，所述步骤c中的货架坐标值包括水平坐标值和垂直坐标值。
9.根据权利要求1所述的货架陈列设计方法，其特征在于，所述步骤d中的货架尺寸包括货架的长、宽、高和货架层板相对货架底边的相对距离。
10.根据权利要求1所述的货架陈列设计方法，其特征在于，所述步骤e中商品在货架3D模型中的指定位置为：距货架左边顶点距离加上前一个绘制模型的距离之和。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011210567.3A CN112330801A (zh) | 2020-11-03 | 2020-11-03 | 一种货架陈列设计方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011210567.3A CN112330801A (zh) | 2020-11-03 | 2020-11-03 | 一种货架陈列设计方法 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN112330801A true CN112330801A (zh) | 2021-02-05 |
Family
ID=74323028
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202011210567.3A Pending CN112330801A (zh) | 2020-11-03 | 2020-11-03 | 一种货架陈列设计方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN112330801A (zh) |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN112990095A (zh) * | 2021-04-13 | 2021-06-18 | 广州市玄武无线科技股份有限公司 | 商品陈列分析方法、装置、设备及存储介质 |
| CN113763113A (zh) * | 2021-03-04 | 2021-12-07 | 北京沃东天骏信息技术有限公司 | 一种物品展示方法和装置 |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2010146445A (ja) * | 2008-12-22 | 2010-07-01 | Toshiba Tec Corp | 陳列限界個数算出システム及び陳列限界個数算出プログラム |
| CN103425825A (zh) * | 2013-08-02 | 2013-12-04 | 苏州两江科技有限公司 | 基于cad平面设计图的3d超市展示方法 |
| CN105279797A (zh) * | 2015-11-25 | 2016-01-27 | 四川物联亿达科技有限公司 | 一种三维仓库组件模型建立方法 |
| CN106651760A (zh) * | 2016-12-20 | 2017-05-10 | 潍坊科技学院 | 基于cad平面设计图的3d超市展示方法 |
| CN111222245A (zh) * | 2020-01-08 | 2020-06-02 | 山东科技职业学院 | 一种数字化服装卖场陈列设计教学方法 |
-
2020
- 2020-11-03 CN CN202011210567.3A patent/CN112330801A/zh active Pending
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2010146445A (ja) * | 2008-12-22 | 2010-07-01 | Toshiba Tec Corp | 陳列限界個数算出システム及び陳列限界個数算出プログラム |
| CN103425825A (zh) * | 2013-08-02 | 2013-12-04 | 苏州两江科技有限公司 | 基于cad平面设计图的3d超市展示方法 |
| CN105279797A (zh) * | 2015-11-25 | 2016-01-27 | 四川物联亿达科技有限公司 | 一种三维仓库组件模型建立方法 |
| CN106651760A (zh) * | 2016-12-20 | 2017-05-10 | 潍坊科技学院 | 基于cad平面设计图的3d超市展示方法 |
| CN111222245A (zh) * | 2020-01-08 | 2020-06-02 | 山东科技职业学院 | 一种数字化服装卖场陈列设计教学方法 |
Cited By (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113763113A (zh) * | 2021-03-04 | 2021-12-07 | 北京沃东天骏信息技术有限公司 | 一种物品展示方法和装置 |
| CN112990095A (zh) * | 2021-04-13 | 2021-06-18 | 广州市玄武无线科技股份有限公司 | 商品陈列分析方法、装置、设备及存储介质 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| EP2546806B1 (en) | Image based rendering for ar - enabling user generation of 3d content | |
| CN109685891B (zh) | 一种基于深度图像的建筑物三维建模与虚拟场景生成方法及系统 | |
| US20200126298A1 (en) | Methods and systems for detecting and combining structural features in 3d reconstruction | |
| US9420253B2 (en) | Presenting realistic designs of spaces and objects | |
| KR101636027B1 (ko) | 실세계 객체들의 3ｄ 모델들 및 실제 스케일 메타데이터를 캡처하고 이동시키기 위한 방법들 및 시스템들 | |
| CN112330801A (zh) | 一种货架陈列设计方法 | |
| CN109215470A (zh) | 一种基于bim+gis的电子沙盘系统及其构建方法 | |
| Knabb et al. | Scientific visualization, 3D immersive virtual reality environments, and archaeology in Jordan and the Near East | |
| CN111354062A (zh) | 一种多维空间数据渲染方法及装置 | |
| JP2011227903A (ja) | パッケージ入り商品の製品画像からの３ｄモデルの自動生成 | |
| WO2020259328A1 (zh) | 界面的生成方法、计算设备及存储介质 | |
| Behzadan et al. | Scalable algorithm for resolving incorrect occlusion in dynamic augmented reality engineering environments | |
| CN111161388B (zh) | 零售商品货架图像的生成方法、系统、设备和存储介质 | |
| CN111273878B (zh) | 一种基于cave空间的视频播放方法、装置及存储介质 | |
| US20140015834A1 (en) | Graphics processing unit, image processing apparatus including graphics processing unit, and image processing method using graphics processing unit | |
| CN113177172A (zh) | 基于WebGL的大批量三维文字高效显示的方法 | |
| CN111028362A (zh) | 图像显示、标注处理、图像处理方法和装置、存储介质 | |
| ATE433172T1 (de) | Wiedergabe von 3d-computergraphik unter verwendung von 2d-computergraphik-fähigkeiten | |
| CN110322539B (zh) | 三维物体的三维模型切割过程显示方法、装置与电子设备 | |
| RU2295772C1 (ru) | Способ генерирования текстуры в реальном масштабе времени и устройство для его реализации | |
| CN117409157A (zh) | 一种三维地质模型在线剖切成图方法 | |
| CN116108523A (zh) | 构图生成方法、构图操作方法、计算机设备及其介质 | |
| KR102662058B1 (ko) | 서로 다른 위치에서 획득한 복수의 2차원 이미지들을 이용하여 3차원 공간 모델링 데이터를 생성하는 장치 및 방법과 이를 위한 프로그램 | |
| CN113643426B (zh) | 一种仿真城市建筑物模型的更新方法、设备及储存介质 | |
| CN114463167A (zh) | 模型展示方法、装置、电子设备及存储介质 |
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 | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20210205 |
|
| RJ01 | Rejection of invention patent application after publication |