1. 箭头组件

1.1. 创建组件管理对象

new ArrowManager(props)

名称	说明	类型	是否必须	默认值	示例说明
props.viewer3D	viewer3D 实例	object	Y	无
props.opt	组件参数及路径信息	object	Y	无
props.opt.points	1：一组描述箭头路径的点位数组，每个点位由一个对象组成,每个对象由 x,y,z 三个属性描述三维空间坐标。插件会根据点位对象生成箭头路径，由第一个点位对象和第二个点位对象生成路径 1，由第二点位对象和第三个点位对象生成路径 2，以此类推。 2：此数组对象至少包含两个点位对象。	Array	Y	无	[{x:0,y:0,z:0},{x:50,y:50,z:50},...]
props.opt.arrowShape	描述箭头形状参数	Object	N	arrowShape:{triangleBottomLength:400,//等腰三角形底边长度 triangleBottomHeight:260,//等腰三角形底边高度 rectangleLength: 500,//矩形长度 rectangleWidth: 180,//矩形宽度 arrowHeight: 80//箭头模型高度 }	与默认值相似
props.opt.speed	描述箭头每次移动距离，此参数可以初始化是设置，也可在初始化后通过接口函数重新指定大小。	float	N	5	与默认值相似
props.opt.spacing	描述箭头间隔距离	float	N	100	与默认值相似
props.opt.colors	1：表示箭头颜色对象，此对象包含对所有路径上的箭头指定的颜色,例如对第一条路径指定红色,1 代表第一次路径，程序默认 1 为第一条路径，default 当对象无法确定颜色的时候会使用 default 指定的颜色。 2：当 colors 属性和 materials 属性都不存在的时候,插件会采用以颜色值为 0xa1d5d6,透明度为 0.8 的基础材质对象作为箭头默认材质。 3：colors 属性生成的材质对象都是基础材质对象，不支持透明度设置，如果想对箭头进行更高级的材质设置，请使用 materials 属性设置箭头颜色。	Object	N	颜色值为：0xa1d5d6,透明度为 0.8 的基础材质对象	colors:{ 1:0xFF0000， default: 0x00ff00; }
props.opt.materials	1：表示箭头材质对象，形式与 colors 对象相似，只不过对每条路径指定的材质不是颜色，而是 THREEJS 生产的材质对象，材质对象也存在 default 值。 2：materials 属性优先级高于 colors 属性，对同一条路径指定的颜色值和材质对象，材质属性会覆盖颜色属性。	Object	N	无	参考 coloers 属性示例说明
props.opt.materialsUpdate	表示箭头路径发生改变的时候，箭头颜色是否变化 fixed:表示箭头在路径发生变化的时候，颜色不会改变。 path:表示箭头在路径发生变化的时候，颜色会发生改变。	string:[fixed\|path]	N	'fixed'	materialsUpdat:'fixed'
props.opt.materialsInit	1：这个参数用于指定箭头的初始材质，是按照箭头初始时路径指定箭头材质，还是按照箭头的默认材质指定箭头材质 2：当箭头入场模式(enterScene:'progressive')为渐进式入场，并更新箭头材质属性为跟随路径模式(materialsUpdat:'path')时,materialsInit 在场景模型显示效果是无意义的。	string:[default\|path]	N	'default'	materialsInit:'default'
props.opt.offset	1：描述箭头在路径上产生的偏移量参数，由于箭头只是按照路径生成排列或者移动轨迹，但是没有考虑在排列过程中被遮挡的情况，此参数用来调整箭头方向避免被遮挡。 2:offset 使用形式与 colors 属性相似，但是 offset 内不包含默认偏移量属性,也就是无法通过一个值设置所有路径的偏移量。 depth：此参数表示箭头距离路径的高度。 angle：此参数表示箭头以路径为轴旋转的角度。	Object	N	无	offset：{ 1: { depth: 20, angle: -60, },... }
props.opt.enterSceMod	描述箭头的入场模式 cover：箭头全部排列在路径上。 progressive:箭头会从起始点一个个渐进进入场景。	string:[cover\|progressive]	N	'cover'	enterSceMod:'cover'
props.opt.createMode	表示箭头创建方式 space：按照空间计算创建箭头数量，主要是依据路径长度，箭头长度，箭头间隔等计算生成箭头的数量 number：按照用户指定数量创建箭头	string:[space\|number]	N	'space'	createMode:'space'
props.opt.arrowAmount	创建箭头数量，当创建模式为按照数量创建的时候，会根据 arrowAmount 属性创建相应个数箭头	number	N	无	arrowAmount:100
props.opt.intervalMode	此参数表示当按照空间初始箭头的情况下余下空间如何使用 free：表示把余下空间平均到每个箭头之间的间隔空间中，在展示效果中箭头与箭头之间的距离会更平均，不向 strict 状态下首尾箭头会出现较大的间隔 strict：表示余下空间不做处理，空间直接闲置	string:[free\|strict]	N	"free"	intervalMode:'free'
props.opt.customizeMesh	表示是否自定义箭头的几何形状，箭头在旋转或者移动的时候默认的初始向量是(1,0,0),箭头的长度是几何体 X 轴的长度	boolean	N	false	customizeMesh:false
props.opt.mesh	在用户自定义几何体形状的情况，表示自定义的几何对象	THREE.Mesh	N	无	mesh:mesh
props.opt.meshLength	在用户自定义几何体形状的情况，表示自定义的几何对象的长度,主要是 x 轴长度	float	N	无	mesh:mesh
props.opt.callback	当箭头进入或者离开一段路径的时候，会触发 callback 对象内回调函数,并返回触发事件的 mesh 对象和所在路径的路径对象 enter：当函数进入到某段路径的时候会触发执行。 out:当函数离开某段路径的时候会执行	Object:{enter:function,out:function }	N	无	callback:{enter:function(mesh,path){}out:function(mesh,path){} }

1.2. 实例对象方法说明

函数名	使用说明	参数	是否建议用户调用
translationPath	处理用户参数，对参数进行格式化	无	否
calculationPathOffset	计算箭头在路径变换的时候做的路径旋转角度路径偏移等	无	否
calculationArrowAmount	计算生成箭头的数量	无	否
createMaterialArray	创建箭头的材质	无	否
createArrowArray	创建箭头数组	无	否
initPosition	初始化箭头位置	无	否
init	内部依次执行下列函数 translationPath,calculationPathOffset,calculationArrowAmount,createMaterialArray,createArrowArray,initPostition,	无	是
setSpeed	设置箭头流速	float	是
startFlow	开启箭头流动	无	是
stopFlow	关闭箭头流动	无	是
updatePosition	对所有箭头执行一次位置更新，更新距离为 speed 数值，用户可以通过此函数灵活控制箭头移动时间间隔	无	可以调用
hide	隐藏所有箭头	无	是
show	显示所有箭头	无	是
clear	删除所有创建的 mesh 对象	无	可以调用

1.2.1. translationPath

处理用户参数，对参数进行格式化

名称	说明	是否需要参数	类型	是否必须	示例
translationPath	处理用户参数，对参数进行格式化	无	无	否	null

返回值说明	类型	示例
无	无	null

调用方式：

/**不建议在不了解插件的情况下使用
 * 处理用户参数，对参数进行格式化
 * @return {number} - 相对缩放速度
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.translationPath();

1.2.2. calculationPathOffset

计算箭头在路径变换的时候做的路径旋转角度路径偏移等

名称	说明	是否需要参数	类型	是否必须	示例
calculationPathOffset	计算箭头在路径变换的时候做的路径旋转角度路径偏移等	无	无	否	null

返回值说明	类型	示例
无	无	null

调用方式：

/**不建议在不了解插件的情况下使用
 * 计算箭头在路径变换的时候做的路径旋转角度路径偏移等
 * @return {number} - 相对缩放速度
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.calculationPathOffset();

1.2.3. calculationArrowAmount

计算生成箭头的数量

名称	说明	是否需要参数	类型	是否必须	示例
calculationArrowAmount	计算生成箭头的数量	无	无	否	null

返回值说明	类型	示例
无	无	null

调用方式：

/**不建议在不了解插件的情况下使用
 * 计算生成箭头的数量
 * @return {number} - 相对缩放速度
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.calculationArrowAmount();

1.2.4. createMaterialArray

创建箭头的材质

名称	说明	是否需要参数	类型	是否必须	示例
createMaterialArray	创建箭头的材质	无	无	否	null

返回值说明	类型	示例
无	无	null

调用方式：

/**不建议在不了解插件的情况下使用
 * 计算生成箭头的数量
 * @return {number} - 相对缩放速度
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.createMaterialArray();

1.2.5. initPostition

初始化箭头位置

名称	说明	是否需要参数	类型	是否必须	示例
initPostition	初始化箭头位置	无	无	否	null

返回值说明	类型	示例
无	无	null

调用方式：

/**不建议在不了解插件的情况下使用
 * 初始化箭头位置
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.initPostition();

demo 示例

示例名称	示例地址
初始化箭头位置	去体验

1.2.6. init

初始化箭头

名称	说明	是否需要参数	类型	是否必须	示例
init	内部依次执行下列函数 translationPath,calculationPathoffset,calculationArrowAmount,createMaterialArray,createArrowArray,initPostition,	无	无	否	null

返回值说明	类型	示例
无	无	null

调用方式：

/**
 * 初始化箭头
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.init();

demo 示例

示例名称	示例地址
初始化箭头	去体验

1.2.7. setSpeed

设置箭头流速

名称	说明	是否需要参数	类型	是否必须	示例
init	设置箭头流速	需要	float	是	bosArrowArray.setSpeed(100);

返回值说明	类型	示例
无	无	null

调用方式：

/**
 * 设置箭头流速
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.init();
bosArrowArray.setSpeed(100);

1.2.8. startFlow

开启箭头流动

名称	说明	是否需要参数	类型	是否必须	示例
startFlow	开启箭头流动	否	无	否	bosArrowArray.startFlow();

返回值说明	类型	示例
无	无	null

调用方式：

/**开启箭头流动
 * 初始化箭头
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.init();
bosArrowArray.startFlow();

demo 示例

示例名称	示例地址
开启箭头流动	去体验

1.2.9. stopFlow

关闭箭头流动

名称	说明	是否需要参数	类型	是否必须	示例
stopFlow	停止箭头流动	否	无	否	bosArrowArray.stopFlow();

返回值说明	类型	示例
无	无	null

调用方式：

/**停止箭头流动
 * 初始化箭头
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.stopFlow();

demo 示例

示例名称	示例地址
关闭箭头流动	去体验

1.2.10. updatePosition

对所有箭头执行一次位置更新，更新距离为 speed 数值，用户可以通过此函数灵活控制箭头移动时间间隔

名称	说明	是否需要参数	类型	是否必须	示例
updatePosition	对所有箭头执行一次位置更新，更新距离为 speed 数值，用户可以通过此函数灵活控制箭头移动时间间隔	否	无	否	bosArrowArray.updatePosition();

返回值说明	类型	示例
无	无	null

调用方式：

/**对所有箭头执行一次位置更新操作
 * 初始化箭头
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.updatePosition();

1.2.11. hide

隐藏所有箭头

名称	说明	是否需要参数	类型	是否必须	示例
hide	隐藏所有箭头	否	无	否	bosArrowArray.hide();

返回值说明	类型	示例
无	无	null

调用方式：

/**隐藏所有箭头
 * 初始化箭头
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.hide();

demo 示例

示例名称	示例地址
隐藏箭头	去体验

1.2.12. show

显示所有箭头

名称	说明	是否需要参数	类型	是否必须	示例
show	显示所有箭头	否	无	否	bosArrowArray.show();

返回值说明	类型	示例
无	无	null

调用方式：

/**显示所有箭头
 * 初始化箭头
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.show();

demo 示例

示例名称	示例地址
显示箭头	去体验

1.2.13. clear

删除所有创建的 mesh 对象

名称	说明	是否需要参数	类型	是否必须	示例
clear	删除所有创建的 mesh 对象	否	无	否	bosArrowArray.clear();

返回值说明	类型	示例
无	无	null

调用方式：

/**删除所有创建的mesh对象
 * 初始化箭头
 */
let bosArrowArray = new BOS3D.Plugins.ArrowManager({ viewer3D: viewer3D, opt: obj });
bosArrowArray.clear();

demo 示例

示例名称	示例地址
删除箭头	去体验

1.2.14. 实例对象属性说明

名称	使用说明	默认值
arrowParameters	插件运行状态下的参数数据对象	用户可以通过此对象查看生成运行状态的参数
arrowArray	mesh 数组对象	用户可以通过此参数获取所有的 mesh 信息
pathNumb	路径数
totalLength	路径总长度
path	路径数组，里面包含了路径的详细参数，包括 mesh 做旋转变换所需的参数
intervalLength	间隔长度，此参数=箭头的几何长度+间隔空间
geometricModelLength	箭头几何长度
isFlowing	表示箭头是否处于流动状态，布尔类型
mesh 扩展属性 lockPosUpDate	此参数为 true 的时候，将会锁定箭头位置，箭头位置将不会更新以及由位置更新引起的 visible 属性的更新
mesh.userData.BosArrowExt.enterState	当箭头以渐进方式入场的时候，此参数标注箭头是已否进入场景中
mesh.pathOrder	表示箭头当前所在的路径序号
...	其余参数可参照上面参数说明中的属性查看	...

1.2.15. 完整样例

完整样例

<!DOCTYPE html>
<html>
    <link />
    <head>
        <meta http-equiv="Content-Type" content="text/html;" />
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
        <title>盈嘉BOS3D浏览器</title>
    </head>
    <body style="margin: 0px;">
        <div id="viewport" style="width: 100%; height: 100%;"></div>
        <script type="application/javascript" src="http://bos3d.bimwinner.com/static/latest/BOS3D.min.js"></script>
        <script>
            window.BOS3D = BOS3D;

            var option = {
                host: "http://bos3d.bimwinner.com",
                viewport: "viewport",
            };
            var viewer3D = new BOS3D.Viewer(option);
            window.viewer3D = viewer3D;
            var modelKey = "M123"; //
            var projectKey = "1234567"; //研发环境
            viewer3D.addView(modelKey, projectKey);

            viewer3D.autoResize();
            window.addEventListener("resize", function () {
                viewer3D.autoResize();
            });
        </script>
    </body>
</html>

箭头组件

1. 箭头组件

1.1. 创建组件管理对象

1.2. 实例对象方法说明

1.2.1. translationPath

1.2.2. calculationPathOffset

1.2.3. calculationArrowAmount

1.2.4. createMaterialArray

1.2.5. initPostition

1.2.6. init

1.2.7. setSpeed

1.2.8. startFlow

1.2.9. stopFlow

1.2.10. updatePosition

1.2.11. hide

1.2.12. show

1.2.13. clear

1.2.14. 实例对象属性说明

1.2.15. 完整样例

results matching ""

No results matching ""