npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

zhongcheng-webvisu

v1.0.1

Published

model sdk

Downloads

4

Readme

Webvisu

模型加载

  1. 所需文件
  • viewSdk.js
  • webviz.js
  • engine-asmjs.js
  • engine-wasm.js
  • engine.wasm
  • server_integration.js
  1. 初始化Api
 const config = { 
 "containerId": 'viewer',  //[必须]容器id
 "isShowThreeCoordinate": true, //是否展示三维坐标指示器
 "isShowNavcube": true   //是否展示三维立方体
 }
  let vieverSdk = new ViewerSDK(config)

3.加载模型

1.服务端加载
 vieverSdk.loaderModelFromServe(secretkey, modelName,rebackfun)

传入参数:

  • secretkey:提供客户的加密key
  • modelName:模型名称
  • rebackfun:模型加载完回调函数 例子:
let hwv
 vieverSdk.loaderModelFromServe("QEKJH3J34Kl", "EBSceshi_1635909931602",rebackFun()).then(mainViewer =>
{
    hwv = mainViewer  
}
function rebackFun ()
{
  console.log("加载完成")
}
2.本地加载
 vieverSdk.loaderModel(url, rebackfun,isShowBg)

传入参数:

  • url:模型地址

  • rebackfun:模型加载完回调函数

  • isShowBg:是否显示背景色

    例子:

    vieverSdk.loaderModel(modelName, (viewMain) =>{console.log("》》》》模型加载完成》》》》")}, false)}

模型接口

 let modeOpt = new ViewerSDK.ModelOpt(hwv)

视口重置

  • modeOpt.reset()

选择

modeOpt.selectOpt(type:string)

参数说明:

  • 单选 "clickSelect"

渲染模式

modeOpt.drawingMode(type: string)

参数说明:

  • 渲染 "Shaded"
  • 线框 "Wireframe"
  • 隐藏线框 "HiddenLine"
  • XRay "XRay"
  • 带线框渲染 "wireframeshaded"

坐标轴

modeOpt.axisMark(isShow: boolean)

参数说明:

  • 显示 true
  • 隐藏 false

浏览立方体

modeOpt.cubeMark(isShow: boolean)

参数说明:

  • 显示 true
  • 隐藏 false

剖切

开启剖切

let cutting = vieverSdk.CuttingPlane;
cutting.cuttingStart(plan:string)

参数说明:

  • X方向 "x"
  • y方向 "y"
  • z方向 "z"

关闭剖切

cutting.resetCuttingPlanes()

切面隐藏

cutting.toggleReferenceGeometry()

相机相关

let cameraOpt = new ViewerSDK.CameraOpt(hwv);

相机方向

cameraOpt.regulateCamera(direction: string) 参数说明

  • 后面 "Back"
  • 前面 "Front"
  • 左面 "Left"
  • 右面 "Right"
  • 上面 "Top"
  • 下面 "Bottom"

模型旋转模式

cameraOpt.modelRotateType(type: string) 参数说明

  • 旋转 "orbit"
  • 转台 "turntable"

相机模式

cameraOpt.changeCameraType(type: number) 参数说明

  • 正交 0
  • 透视 1

漫游

let roamOpt = new ViewerSDK.RoamOpt(hwv);

开启漫游 默认键盘

roamOpt.startRoam();

关闭漫游

roamOpt.stopRoam();

漫游方式

roamOpt.setWalkSettings(type:string) 参数说明

  • 鼠标 "Mouse"
  • 键盘 "Keyboard"

键盘操作说明

  • 移动 w、a、s、d
  • 上下 x、c
  • 旋转 q、e
  • 倾斜 R、F

设置漫游旋转速度(角度/秒) 默认40

roamOpt.setRotationDeg(num:number)

设置漫游速度(m/s)

roamOpt.setWalkSpeed(num:number)

设置高程速度(m/s)

roamOpt.setWalkSpeed(num:number)

设置视角范围(角度/秒) 默认90

roamOpt.setRViewDeg(num:number)

构件操作

` let componentOpt = new ViewerSDK.ComponentOpt(hwv);

`

聚焦

componentOpt.focuseNodes(ids: number [], duration?: number) 参数说明

  • ids 构件的id
  • duration 速度

高亮

componentOpt.setHighlighted(ids: number[], highlighted: boolean) 参数说明

  • ids 构件的id
  • highlighted true为高亮 false 为去除高亮

染色

componentOpt.setNodesFaceColor (ids: number[], color: String) 参数说明

  • ids 构件的id
  • color 颜色为rgb数值 例子: 19,6,23

隔离

componentOpt.quarantine (nodeId: number) 参数说明

  • nodeId 构件的id

透明度

componentOpt.setTransparency(ids: number[], transparency: number) 参数说明

  • ids 构件的id
  • transparency 透明数值 0-1

隐藏

componentOpt.setNodesVisibility(ids: number[], visibility: boolean)

  • ids 构件的id
  • visibility true为显示 false 为去除隐藏

重置所有模型的透明度

componentOpt.resetTransparency()

获取节点的父节点

componentOpt.getNodeParent(nodeId:number) 参数说明

  • nodeId 构件的id

获取节点的子节点

componentOpt.getNodeChildren(nodeId:number) 参数说明

  • nodeId 构件的id

获取当前节点的变换矩阵

componentOpt.getNodeMatrix(nodeId:number) 参数说明

  • nodeId 构件的id

获取节点的包围盒

componentOpt.getNodeRealBounding(nodeId:number) 参数说明

  • nodeId 构件的id

获取多个节点的包围盒

componentOpt.getNodesBounding(nodeIdnodeIds:number[]) 参数说明

  • nodeId 构件的id

重置所有构件的颜色

componentOpt.resetNodesColor()

重置所有构件的显示/隐藏状态

componentOpt.resetNodesVisibilityStatus()

重置所有构件的变换矩阵

componentOpt.resetNodesTransform()

获取节点名称

componentOpt.getNodeName(nodeId:number) 参数说明

  • nodeId 构件的id

获取构件属性

componentOpt.getNodeProperties(nodeId:number):Promise 参数说明

  • nodeId 构件的id