3D Real 开发者工具 API threed-real-sdk.js

简介: GitHub:https://github.com/BaiFeng3DREAL/threed-real-viewer详情:https://www.3dreal.com用途3D Real 开发者工具,可以帮助您开发自己的三维产品展示页面,提供了高度自定义的接口。

GitHub:https://github.com/BaiFeng3DREAL/threed-real-viewer
详情:https://www.3dreal.com

用途

3D Real 开发者工具,可以帮助您开发自己的三维产品展示页面,提供了高度自定义的接口。

名词定义

  • 普通模型(General Model):与模型中心“我的模型”中的模型一一对应。
  • 场景(Scene):与模型中心“我的搭配”中的场景一一对应。场景由一个或多个产品构成,如衬衫、裤子等构成一个场景。
  • 产品(Product): 产品由一个或多个组合组成,如圆摆衬衫可由口袋、大身两个组合组成。
  • 组合(Combination):组合由一个或多个部件组成,如圆摆衬衫大身(组合)由袖口裥、门襟、后片、领型、袖口等组成。
    备注:每个组合可关联多种材料。
  • 部件(Part):部件包括一个或多个基本模型,如圆摆衬衫领型包括小方领、小尖领、一字领、立领、中标领等。
  • 基本模型(Basic Model):基本模型由一个模型和(零个或多个)固定模型组成,如衬衫领型可由领子模型,扣子、扣眼、缝线等固定模型组成。
  • 固定模型 (Fixed Model) :如衬衫领型的扣子、扣眼、缝线等可以作为固定模型。
  • 面料(Fabric):贴在模型上的贴图。

后台接口

为了保证安全,以下接口需要通过后端接入,然后通过你们自行设计的接口将数据传入到前端,并把数据给到3D前端SDK。

获取access token

URL:/api/getAccessToken
Method:GET

queryData:
accessKey: 从API申请页面拿到的accessKey,
accessSecret: 从API申请页面拿到的accessSecret

Return:

{
    // 返回状态码, 0为成功,其他为失败。
    code: number,

    // 错误信息
    message: string,
    
    // token
    data: string
}

3D Real 开发者工具

3D Real 开发者工具,可以帮助您开发自己的三维产品展示页面,提供了高度自定义的接口。使用方式如下:

引入方式

初始化

var api = new ThreeDRealAPI(token: string);

参数解析:
    token: 使用 AccessKey 和 AccessSecret 获取的token。

获取私有场景

获取私有搭配列表

api.fetchScenes()

参数解析:
  返回值: Promise<{
    id: number,
    name: string,
    cover: string
  }[]>

获取私有模型列表

api.fetchScenes()

参数解析:
  返回值: Promise<{
    id: number,
    name: string,
    cover: string
  }[]>

获取 远端数据 以及 三维场景交互控制器

获取搭配数据,以及三维场景交互控制器。

api.getCollocationView();

参数解析:
  返回值: Promise<{
    data: object(如何使用,请看 demo 中的例子),
    threedViewer: ThreeDRealViewer
  }[]>

获取模型数据,以及三维场景交互控制器。

api.getModelView(div: HTMLDivElement, id: number, finish?: () => void);
参数解析:
  返回值: Promise<{
    data: object(如何使用,请看 demo 中的例子),
    threedViewer: ThreeDRealViewer
  }[]>

通过上面的接口获取三维视图控制器,对于搭配来说,我们可以通过调用以下接口触发模型的变换:

切换产品


viewer.selectProduct(productIndex: number);

参数解析:
    productIndex: 当前产品对应的下标.
    返回值: undefined

说明:
  用于动画切换,如果没有触发动画,请确认后台是否有设置动画操作。

切换组合

viewer.selectCombination(productIndex: number, combIndex: number);

参数解析:
    productIndex: 当前产品对应的下标.
    combIndex: 当前组合的下标.
    返回值: undefined

说明:
  用于动画切换,如果没有触发动画,请确认后台是否有设置动画操作。

切换组件

viewer.selectElement(productIndex: number, combIndex: number, pIndex: number, eIndex: number);

参数解析:
    productIndex: 当前产品对应的下标.
    combIndex: 当前组合的下标.
    pIndex: 当前部件的下标.
    eIndex: 需要切换到的组件的下标.
    返回值: Promise

切换面料

viewer.selectFabric (productIndex: number, combIndex: number, targetFIndex: number);

参数解析:
    productIndex: 当前产品对应的下标.
    combIndex: 当前组合的下标.
    targetFIndex: 需要切换到的面料的下标
  返回值: Promise

销毁 三维视图控制器

  viewer.destroy()

总结

具体的接入流程可以进入3DREAL众设平台开发文档-接入流程查看。

相关文章
|
监控 API 计算机视觉
CompreFace:Star6.1k,Github上火爆的轻量化且强大的人脸识别库,api,sdk都支持
CompreFace 是一个在 GitHub 上拥有 6.1k Star 的轻量级人脸识别库,支持 API 和 SDK。它由 Exadel 公司开发,基于深度学习技术,提供高效、灵活的人脸识别解决方案。CompreFace 支持多种模型(如 VGG-Face、OpenFace 和 Facenet),具备多硬件支持、丰富的功能服务(如人脸检测、年龄性别识别等)和便捷的部署方式。适用于安防监控、商业领域和医疗美容等多个场景。
2068 4
|
人工智能 IDE API
AI驱动的开发者工具:打造沉浸式API集成体验
本文介绍了阿里云在过去十年中为开发者提供的API服务演变。内容分为两大部分:一是从零开始使用API的用户旅程,涵盖API的发现、调试与集成;二是回顾阿里云过去十年为开发者提供的服务及发展历程。文中详细描述了API从最初的手写SDK到自动化生成SDK的变化,以及通过API Explorer、IDE插件和AI助手等工具提升开发者体验的过程。这些工具和服务旨在帮助开发者更高效地使用API,减少配置和调试的复杂性,提供一站式的解决方案。
|
JavaScript 前端开发 API
Vue.js 3:探索组合式API带来的新变革
Vue.js 3:探索组合式API带来的新变革
541 84
|
前端开发 JavaScript NoSQL
使用 Node.js、Express 和 React 构建强大的 API
本文详细介绍如何使用 Node.js、Express 和 React 构建强大且动态的 API。从开发环境搭建到集成 React 前端,再到利用 APIPost 高效测试 API,适合各水平开发者。内容涵盖 Node.js 运行时、Express 框架与 React 库的基础知识及协同工作方式,还涉及数据库连接和前后端数据交互。通过实际代码示例,助你快速上手并优化应用性能。
|
人工智能 API 开发工具
【AI大模型】使用Python调用DeepSeek的API,原来SDK是调用这个,绝对的一分钟上手和使用
本文详细介绍了如何使用Python调用DeepSeek的API,从申请API-Key到实现代码层对话,手把手教你快速上手。DeepSeek作为领先的AI大模型,提供免费体验机会,帮助开发者探索其语言生成能力。通过简单示例代码与自定义界面开发,展示了API的实际应用,让对接过程在一分钟内轻松完成,为项目开发带来更多可能。
|
JSON 缓存 JavaScript
深入浅出:使用Node.js构建RESTful API
在这个数字时代,API已成为软件开发的基石之一。本文旨在引导初学者通过Node.js和Express框架快速搭建一个功能完备的RESTful API。我们将从零开始,逐步深入,不仅涉及代码编写,还包括设计原则、最佳实践及调试技巧。无论你是初探后端开发,还是希望扩展你的技术栈,这篇文章都将是你的理想指南。
|
JavaScript 前端开发 安全
盘点原生JS中目前最没用的几个功能API
在JavaScript的发展历程中,许多功能与API曾风光无限,但随着技术进步和语言演化,部分功能逐渐被淘汰或被更高效的替代方案取代。例如,`with`语句使代码作用域复杂、可读性差;`void`操作符功能冗余且影响可读性;`eval`函数存在严重安全风险和性能问题;`unescape`和`escape`函数已被`decodeURIComponent`和`encodeURIComponent`取代;`arguments`对象则被ES6的剩余参数语法替代。这些变化体现了JavaScript不断优化的趋势,开发者应紧跟技术步伐,学习新技能,适应新技术环境。
354 10
|
弹性计算 监控 安全
API稳定安全最佳实践:用阿里云SDK为业务保驾护航
阿里云智能集团高级技术专家赵建强和曹佩杰介绍了API稳定安全最佳实践,涵盖业务上云真实案例、集成开发最佳实践、配额管理和共担模型四部分。通过分析企业在不同阶段遇到的问题,如签名报错、异常处理不严谨、扩容失败等,提出了解决方案和工具,确保API调用的安全性和稳定性。特别强调了SDK的使用、无AK方案、自动刷新机制以及配额中心的作用,帮助用户构建更稳定、安全的服务,提升运维效率。最终介绍了集成开发共担模型,旨在通过最佳实践和平台工具,保障业务的稳定与安全,推动行业创新与发展。
|
JSON JavaScript 前端开发
深入浅出Node.js:从零开始构建RESTful API
在数字化时代的浪潮中,后端开发作为连接用户与数据的桥梁,扮演着至关重要的角色。本文将引导您步入Node.js的奇妙世界,通过实践操作,掌握如何使用这一强大的JavaScript运行时环境构建高效、可扩展的RESTful API。我们将一同探索Express框架的使用,学习如何设计API端点,处理数据请求,并实现身份验证机制,最终部署我们的成果到云服务器上。无论您是初学者还是有一定基础的开发者,这篇文章都将为您打开一扇通往后端开发深层知识的大门。
460 12
|
XML API 开发工具
如何接入电竞体育直播API或者SDK
接入电竞体育直播API或SDK的步骤包括:1. 选择合适的API/SDK提供商,如ESL、Riot Games、Twitch等;2. 注册并获取API密钥;3. 阅读官方文档,了解接口调用和数据处理;4. 实现实时更新,确保数据同步;5. 测试与优化,确保功能稳定;6. 遵守使用规范。通过这些步骤,可成功集成电竞直播功能。