做法简述（其一）：先给要参与点击的楼画上透明的3dpolygon，同时设置建筑图层不参与点击，因为能让我们判断出点击的是哪个建筑，将点击的建筑的3dpolygon的id传入操作函数，根据id拿到建筑坐标的索引，利用该索引画出点击楼的3dpolygon以及他的关系建筑
目录
二、先给每个参与点击的建筑换上一层3dpolygon，用于判断点击到是哪个建筑
三、点击之后根据传回来的id判断点击的是哪个建筑，给其及其关系建筑添加有颜色的3dpolygon
四：去components/aircityutils/Event.ts 写上点击事件，以及传回id，
一、生成随机关系建筑
const buildCoordinates = [
{
name: '杭州大剧院',
coor: [[520321.34375, 3347341.5, 7.143584], [520344.90625, 3347359, 7.143564], [520355.375, 3347369, 7.143642], [520385.71875, 3347399, 7.343637], [520399, 3347426.25, 7.343643], [520406.09375, 3347453.25, 8.343623], [520407.1875, 3347480.75, 7.143638], [520404.3125, 3347501.75, 7.143642], [520385.5, 3347529.75, 7.143652], [520346.875, 3347554.5, 7.143642], [520310.65625, 3347563, 7.143652], [520284.0625, 3347556.75, 8.743203], [520247.3125, 3347535.5, 7.342915], [520216.1875, 3347505.5, 7.343643], [520199.84375, 3347483.75, 7.143603], [520190.28125, 3347464, 7.143603], [520184.75, 3347421, 7.143603], [520188.03125, 3347383.25, 7.143613], [520216.90625, 3347341.5, 7.143652], [520258.53125, 3347326.25, 7.143623], [520295.25, 3347330, 7.143594], [520321.625, 3347341, 7.143603]],
markerCoor: [520272.25, 3347428.75, 65.1435546875],
},
{
name: '杭州国际会议中心',
coor: [[520094.71875, 3347213.25, 7.965303], [520106.6875, 3347201.5, 7.974199], [520119.78125, 3347191.75, 7.974189], [520128.875, 3347187.5, 7.253623], [520141.96875, 3347183.75, 7.143642], [520163.28125, 3347179.5, 8.234697], [520179.0625, 3347180, 7.643642], [520191.5, 3347180.75, 7.643638], [520200.0625, 3347183.5, 7.643589], [520211.21875, 3347187, 7.143701], [520220.84375, 3347192.5, 7.143633], [520231.25, 3347202.75, 7.143613], [520241.84375, 3347219.25, 7.143642], [520246.3125, 3347229.25, 7.643642], [520249.3125, 3347240, 7.983633], [520250.1875, 3347253.75, 7.74877], [520247.71875, 3347269.75, 7.655859], [520243.96875, 3347282.5, 7.665488], [520237.75, 3347299.5, 7.143652], [520227.8125, 3347313, 7.143672], [520215.65625, 3347323.75, 7.143672], [520198.34375, 3347336.5, 7.143692], [520179.6875, 3347345, 7.143633], [520157.9375, 3347349.5, 7.143642], [520137.1875, 3347349.75, 8.386972], [520119.375, 3347345.75, 7.580869], [520103.09375, 3347339.5, 7.143731], [520084.34375, 3347327.5, 7.143808], [520074.34375, 3347310.5, 7.143711], [520068.5, 3347298, 7.543398], [520066.4375, 3347277, 7.543374], [520069.625, 3347261.25, 8.319223], [520073.59375, 3347250.25, 7.98771], [520077.59375, 3347238.75, 7.703955], [520084.0625, 3347226.75, 7.280176], [520094.125, 3347213.5, 7.253769]],
markerCoor: [520164.75, 3347266.5, 98.941546630859375]
},
{
name: 'UDC时代大厦',
coor: [[520315.40625, 3347709.5, 7.343652], [520334.65625, 3347672.5, 7.343633], [520379.15625, 3347636.75, 7.543613], [520413.09375, 3347623.25, 7.343633], [520423.0625, 3347627, 7.343691], [520441.65625, 3347677.25, 7.343672], [520349.625, 3347747, 15.355078], [520316, 3347710.25, 7.343789]],
markerCoor: [520379.59375, 3347685, 147.355097770690918]
},
{
name: '宏程国际大厦',
coor: [[520465.09375, 3347685.75, 7.343623], [520526.625, 3347758.75, 8.043633], [520477.25, 3347791, 7.343643], [520421.875, 3347717.5, 15.355068], [520464.6875, 3347685.5, 7.343643]],
markerCoor: [520459.46875, 3347722.75, 165.53768920898438]
},
{
name: '迪凯国际中心',
coor: [[520347.1875, 3347767.5, 7.343633], [520398.4375, 3347730, 15.355088], [520400.09375, 3347728.5, 15.355088], [520462.875, 3347810.5, 8.043643], [520414.78125, 3347842.5, 7.543643], [520348.1875, 3347768, 7.343643]],
markerCoor: [520426.78125, 3347804, 145.89244079589844],
},
{
name: '杭州来福士中心',
coor: [[520010.90625, 3347918.25, 7.143164], [520039.34375, 3347902.5, 7.322852], [520064.4375, 3347906.25, 7.613633], [520099.78125, 3347926.5, 6.989121], [520125.71875, 3347944.25, 6.891289], [520161.5, 3347939.25, 7.143145], [520187.875, 3347950.25, 7.299785], [520209.46875, 3347985.25, 6.980879], [520199.15625, 3348006.5, 7.343125], [520158.875, 3348017.5, 7.143106], [520140.1875, 3348010.25, 6.890967], [520132.90625, 3347997.25, 6.829297], [520111.96875, 3347984.25, 6.671758], [520083.625, 3347965.5, 6.676485], [520043.40625, 3347978, 6.905488], [520024.46875, 3347963.75, 7.062988], [520007.8125, 3347942.5, 6.949141], [520012.15625, 3347918.75, 7.143086]],
markerCoor: [520043.15625, 3347938, 250.80831909179688],
},
{
name: '杭州市人民政府',
coor: [[519814.375, 3347473.5, 8.522051], [520030.6875, 3347759, 8.49918], [519742.96875, 3347970.25, 8.800019], [519537.65625, 3347686, 8.686954], [519811.25, 3347472, 8.579571]],
markerCoor: [519782.5, 3347716.25, 112.121326446533203]
},
{
name: '杭州市国际中心',
coor: [[520230.03125, 3348037.25, 7.343125], [520246.75, 3348055, 7.238584], [520278.3125, 3348097.25, 7.237295], [520301.40625, 3348129.75, 7.436865], [520240.125, 3348180, 7.443985], [520181.875, 3348222.25, 7.343125], [520139.78125, 3348194, 7.343144], [520108.96875, 3348146.75, 7.343144], [520152.75, 3348097.5, 7.274844], [520228.71875, 3348037, 7.343418]],
markerCoor: [520198.90625, 3348141.75, 273.964961051940918]
},
{
name: '中国人寿大厦',
coor: [[519807.375, 3348054, 7.442383], [519860.78125, 3348016.75, 7.343164], [519897.75, 3348077, 8.425508], [519848.53125, 3348110, 7.270898], [519807.21875, 3348054.25, 7.431894]],
markerCoor: [519863.78125, 3348072.5, 175.4329833984375]
},
{
name: '杭州钓鱼台酒店',
coor: [[520016.28125, 3346870.75, 10.578906], [520028.9375, 3346893, 26.231855], [520019.71875, 3346892.25, 7.383164], [520058.78125, 3346972.5, 21.102911], [520048.4375, 3346977.5, 21.102911], [520082.375, 3347041, 7.634727], [520092.28125, 3347035.25, 7.763613], [520117.15625, 3347051, 7.50709], [520127.96875, 3347044.25, 7.506607], [520131.1875, 3347047.5, 8.235205], [520160.6875, 3347024.75, 9.70289], [520157.75, 3347016.25, 9.794336], [520138.34375, 3346999.25, 7.815269], [520142.03125, 3346990.75, 9.769306], [520139.03125, 3346979.75, 9.757939], [520131.71875, 3346969.75, 27.081615], [520123.5625, 3346965.25, 21.10288], [520117.09375, 3346963.25, 21.10288], [520110.46875, 3346940.5, 21.10289], [520107.625, 3346933, 9.71207], [520065.71875, 3346865.75, 9.644384], [520056.75, 3346870.5, 8.043633], [520049.25, 3346858.75, 13.847886], [520048.375, 3346856.75, 13.84332], [520026.625, 3346873.25, 26.231836]],
markerCoor: [520108.71875, 3346990.75, 97.368545532226563]
},
{
name: '泛海国际中心',
coor: [[520010.65625, 3346934.5, 6.843399], [520059.78125, 3347012, 7.348672], [519870.96875, 3347154.75, 7.143145], [519816.5625, 3347083.25, 7.54206], [520012.65625, 3346937.5, 6.843399]],
markerCoor: [519947.0625, 3347056, 155.04203796386719]
},
{
name: '迪拜银座',
coor: [[519932.78125, 3347117.25, 7.342207], [519993.09375, 3347194.75, 7.542129], [519995.5625, 3347200.25, 7.542099], [519946.125, 3347236.75, 7.604209], [519885.15625, 3347157, 7.342207], [519882.4375, 3347153.5, 7.344687], [519931.8125, 3347117.25, 7.344473]],
markerCoor: [519956.09375, 3347190.75, 154.48291015625]
},
{
name: '财富金融中心',
coor: [[519811.90625, 3347147.75, 7.342558], [519824.3125, 3347150.5, 7.342686], [519834.90625, 3347164.25, 7.342539], [519835.90625, 3347184.75, 7.143125], [519836.3125, 3347192.25, 7.37334], [519841.875, 3347198, 2.690146], [519846.4375, 3347208.75, 3.204619], [519861.90625, 3347210.25, 7.342558], [519875.125, 3347219.25, 7.342695], [519887.8125, 3347235.5, 7.342637], [519888.25, 3347252.25, 7.342568], [519875.5625, 3347263.25, 7.342578], [519848.1875, 3347265.75, 7.342568], [519832.15625, 3347259.5, 14.212578], [519822.3125, 3347253.25, 14.212568], [519814.09375, 3347241.75, 5.143618], [519813.1875, 3347230, 5.143633], [519814.25, 3347224.25, 5.143642], [519810.46875, 3347220.75, 7.143145], [519796.84375, 3347219.75, 7.143145], [519792.875, 3347215.5, 14.896763], [519783.28125, 3347203.25, 7.14314], [519781.65625, 3347188, 5.143638], [519784.03125, 3347174, 7.342554], [519791.53125, 3347161.25, 14.896758], [519798.5625, 3347153, 7.342568], [519811.875, 3347147.75, 7.342573]],
markerCoor: [519841.09375, 3347202.5, 231.514904022216797]
},
{
name: '高德置地广场',
coor: [[519640.46875, 3347242.25, 7.263652], [519736.125, 3347373, 7.263789], [519614.75, 3347455.75, 7.263848], [519523.78125, 3347325.5, 7.263633], [519639.5625, 3347242, 7.263633]],
markerCoor: [519625.09375, 3347347.75, 154.640899658203125]
},
{
name: '华联·全景天地',
coor: [[520521.78125, 3347608, 7.120185], [520524.9375, 3347598.25, 7.127754], [520534.65625, 3347585.5, 7.17333], [520549.3125, 3347587.25, 7.224443], [520552, 3347595.5, 7.238857], [520554.65625, 3347606, 7.255781], [520559.28125, 3347616.75, 7.739346], [520565.34375, 3347625.25, 8.373643], [520572.40625, 3347631.25, 9.611807], [520578.5, 3347636.5, 8.723332], [520584.71875, 3347640.75, 7.978096], [520589.46875, 3347643.5, 8.220063], [520592.09375, 3347646, 7.49625], [520589.96875, 3347662.5, 7.481626], [520579.34375, 3347666.5, 7.408579], [520569.0625, 3347667.25, 7.344351], [520550.0625, 3347663.75, 7.253867], [520541.375, 3347655, 7.229248], [520540.75, 3347644.5, 7.204004], [520547.46875, 3347641.75, 7.234438], [520543.625, 3347632.75, 7.220757], [520537.5, 3347634.25, 7.205908], [520527.65625, 3347632.75, 7.172348], [520522.78125, 3347628.75, 7.160166], [520520.90625, 3347621.5, 7.148633], [520519.75, 3347615.5, 7.129478], [520522.125, 3347608, 7.121523]],
markerCoor: [520553.65625, 3347630.25, 105.709121704101563]
},
{
name: 'UDC·钱塘会馆',
coor: [[520565.75, 3347677.25, 7.309375], [520574.96875, 3347675, 7.371758], [520585.0625, 3347674.75, 7.439482], [520596.875, 3347675.75, 7.539804], [520609.125, 3347682.25, 7.649072], [520609.625, 3347699.5, 7.593125], [520597.65625, 3347703.25, 7.486377], [520580.09375, 3347702.75, 7.34876], [520570.09375, 3347700.5, 7.288926], [520562.0625, 3347696.5, 7.258213], [520561.34375, 3347684, 7.284243], [520560.9375, 3347679.5, 7.274712], [520565.8125, 3347677.5, 7.309688]],
markerCoor: [520584.3125, 3347690.75, 105.852775573730469]
},
{
name: '迪凯金座',
coor: [[520309.0625, 3347799.75, 7.343652], [520323.8125, 3347817, 7.343633], [520335.90625, 3347811, 7.343672], [520380.8125, 3347871.25, 7.343789], [520324.03125, 3347912.5, 7.343672], [520264.59375, 3347835.25, 7.343633], [520309.21875, 3347800, 7.343643]],
markerCoor: [520309.5625, 3347864.25, 210.24496459960938]
},
{
name: '华峰国际',
coor: [[520205.46875, 3347765.25, 7.343906], [520267.5, 3347717, 7.343711], [520313.21875, 3347777.25, 7.343613], [520248.5625, 3347827, 7.343633], [520205.53125, 3347765.25, 7.343906]],
markerCoor: [520256.34375, 3347743.75, 152.99903869628906]
},
]
export const randomNum = (min: number, max: number) =>
Math.floor(Math.random() * (max - min + 1)) + min;
const getRandomArr = (arr: any, length: number, oneself: number) => //arr为可能出现的元素集合
{
const randomArr = JSON.parse(JSON.stringify(arr))
randomArr.splice(oneself, 1)
// console.log(randomArr, 'aiaiaiaiaiaiaiaiia');
const temp = new Array(); //temp存放生成的随机数组
const count = length;
for (let i = 0; i < count; i++) {
const num = Math.floor(Math.random() * randomArr.length); //生成随机数num
temp.push(randomArr[num]); //获取arr[num]并放入temp
randomArr.splice(num, 1);
}
return temp;
}
const randomRelationshipObjArr = JSON.parse(JSON.stringify(buildCoordinates))
buildCoordinates.forEach((item: any, index: number) => {
const cord = randomNum(2, 4)
const randomRelationshipArr = getRandomArr(buildCoordinates, cord, index)
randomRelationshipObjArr[index].children = randomRelationshipArr
})
export { randomRelationshipObjArr, buildCoordinates } 二、先给每个参与点击的建筑换上一层3dpolygon，用于判断点击到是哪个建筑
const addAllPolygon3d = async () => {
const polygon3dArr: any = []
buildCoordinates.forEach(async (item: any, index: number) => {
const polygon3d = {
id: 'initRelationshipOfArchitecture_' + index,
groupId: 'initializeBuild_' + index,
coordinates: item.coor,
color: [0 / 255, 218 / 255, 232 / 255, 0], //颜色值
height: item.markerCoor[2], //3D多边形的高度
intensity: 1.0, //亮度
style: 1, //3DPolygon的样式 请参照API开发文档选取枚举
tillingX: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图横向平铺
tillingY: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图纵向平铺
// material: "/JC_CustomAssets/MaterialLibrary/Exhibition/地面_人造/地面_人造_13", //自定义材质路径
scalarParameters: [{ "name": "亮度", "value": 1.0 }], //材质数值类型参数
vectorParameters: [{ "name": "颜色", "value": [1, 1, 1] }], //材质数组类型参数
generateTop: true, //是否生成顶面
generateSide: true,//是否生成侧面
generateBottom: false//是否生成底面
};
polygon3dArr.push(polygon3d)
})
await __g.polygon3d.add(polygon3dArr)
}
三、点击之后根据传回来的id判断点击的是哪个建筑，给其及其关系建筑添加有颜色的3dpolygon
//点击楼
export const handleClickPolygon3d = async (groupId: string) => {
await handleDeletePolygon3d()
const markerArr: any = []
const polygon3dArr: any = []
const odlineArr: any = []
const index = Number(groupId.slice(groupId.lastIndexOf('_') + 1))
//点击的楼的polygon3d
const polygon3d = {
id: 'RelationshipOfArchitecture_' + index,
coordinates: randomRelationshipObjArr[index].coor,
groupId: 'RelationshipOfArchitecture_' + index,
color: [0 / 255, 218 / 255, 232 / 255, 0.6], //颜色值
height: randomRelationshipObjArr[index].markerCoor[2], //3D多边形的高度
intensity: 1.0, //亮度
style: 1, //3DPolygon的样式 请参照API开发文档选取枚举
tillingX: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图横向平铺
tillingY: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图纵向平铺
// material: "/JC_CustomAssets/MaterialLibrary/Exhibition/地面_人造/地面_人造_13", //自定义材质路径
scalarParameters: [{ "name": "亮度", "value": 1.0 }], //材质数值类型参数
vectorParameters: [{ "name": "颜色", "value": [1, 1, 1] }], //材质数组类型参数
generateTop: true, //是否生成顶面
generateSide: true,//是否生成侧面
generateBottom: false//是否生成底面
};
//点击的楼的marker
const marker = {
id: 'RelationshipOfArchitecture_Marker_' + index,
groupId: 'markerAdd',
coordinate: randomRelationshipObjArr[index].markerCoor,//坐标位置
coordinateType: 0,//默认0是投影坐标系，也可以设置为经纬度空间坐标系值为1
anchors: [-25, 50],//锚点，设置Marker的整体偏移，取值规则和imageSize设置的宽高有关，图片的左上角会对准标注点的坐标位置。示例设置规则：x=-imageSize.width/2，y=imageSize.height
imageSize: [50, 70],//图片的尺寸
hoverImageSize: [55, 77],//鼠标悬停时显示的图片尺寸
range: [1, 100000],//可视范围
imagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',//显示图片路径
hoverImagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',// 鼠标悬停时显示的图片路径
fixedSize: true,//图片固定尺寸，取值范围：false 自适应，近大远小，true 固定尺寸，默认值：false
text: randomRelationshipObjArr[index].name,//显示的文字
useTextAnimation: true,//打开文字展开动画效果
textRange: [1, 1000000],//文本可视范围[近裁距离, 远裁距离]
textOffset: [0, 0],// 文本偏移
textBackgroundColor: [0, 0, 1, 0.5],//文本背景颜色
fontSize: 20,//字体大小
fontOutlineSize: 1,//字体轮廓线大小
fontColor: Color.White,//字体颜色
fontOutlineColor: Color.Black,//字体轮廓线颜色
popupURL: `@path:智慧杭州/customTag/university.html`,//弹窗HTML链接
popupBackgroundColor: [1.0, 1.0, 1.0, 0.5],//弹窗背景颜色
popupSize: [600, 400],//弹窗大小
popupOffset: [0, 0],//弹窗偏移
showLine: false,//标注点下方是否显示垂直牵引线
lineSize: [2, 100],//垂直牵引线宽度和高度[width, height]
lineColor: Color.SpringGreen,//垂直牵引线颜色
lineOffset: [0, 0],//垂直牵引线偏移
autoHidePopupWindow: true,//失去焦点后是否自动关闭弹出窗口
autoHeight: false,// 自动判断下方是否有物体
displayMode: 2,//显示模式
clusterByImage: true,// 聚合时是否根据图片路径分类，即当多个marker的imagePath路径参数相同时按路径对marker分类聚合
priority: 0,//避让优先级
occlusionCull: false//是否参与遮挡剔除
}
markerArr.push(marker)
polygon3dArr.push(polygon3d)
needDelete3dPolygonArr.push('RelationshipOfArchitecture_' + index)
needDeleteMarkerArr.push('RelationshipOfArchitecture_Marker_' + index)
randomRelationshipObjArr[index].children.forEach((children: any, i: number) => {
//点击楼的关系楼的polygon3d
const polygon3dChildren = {
id: 'RelationshipOfArchitecture_children_' + index + i,
coordinates: children.coor,
groupId: 'RelationshipOfArchitecture_children_' + index,
color: [241 / 255, 123 / 255, 3 / 255, 0.7], //颜色值
height: children.markerCoor[2], //3D多边形的高度
intensity: 1.0, //亮度
style: 1, //3DPolygon的样式 请参照API开发文档选取枚举
tillingX: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图横向平铺
tillingY: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图纵向平铺
// material: "/JC_CustomAssets/MaterialLibrary/Exhibition/地面_人造/地面_人造_13", //自定义材质路径
scalarParameters: [{ "name": "亮度", "value": 1.0 }], //材质数值类型参数
vectorParameters: [{ "name": "颜色", "value": [1, 1, 1] }], //材质数组类型参数
generateTop: true, //是否生成顶面
generateSide: true,//是否生成侧面
generateBottom: false//是否生成底面
};
//点击楼的关系楼的marker
const markerChildren = {
id: 'mansion_children_' + index + i,
groupId: 'markerAdd',
coordinate: children.markerCoor,//坐标位置
coordinateType: 0,//默认0是投影坐标系，也可以设置为经纬度空间坐标系值为1
anchors: [-25, 50],//锚点，设置Marker的整体偏移，取值规则和imageSize设置的宽高有关，图片的左上角会对准标注点的坐标位置。示例设置规则：x=-imageSize.width/2，y=imageSize.height
imageSize: [50, 70],//图片的尺寸
hoverImageSize: [55, 77],//鼠标悬停时显示的图片尺寸
range: [1, 100000],//可视范围
imagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',//显示图片路径
hoverImagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',// 鼠标悬停时显示的图片路径
fixedSize: true,//图片固定尺寸，取值范围：false 自适应，近大远小，true 固定尺寸，默认值：false
text: children.name,//显示的文字
useTextAnimation: true,//打开文字展开动画效果
textRange: [1, 1000000],//文本可视范围[近裁距离, 远裁距离]
textOffset: [0, 0],// 文本偏移
textBackgroundColor: [0, 1, 0, 0.5],//文本背景颜色
fontSize: 18,//字体大小
fontOutlineSize: 1,//字体轮廓线大小
fontColor: Color.White,//字体颜色
fontOutlineColor: Color.Black,//字体轮廓线颜色
popupURL: `@path:智慧杭州/customTag/university.html`,//弹窗HTML链接
popupBackgroundColor: [1.0, 1.0, 1.0, 0.5],//弹窗背景颜色
popupSize: [600, 400],//弹窗大小
popupOffset: [0, 0],//弹窗偏移
autoHidePopupWindow: true,//失去焦点后是否自动关闭弹出窗口
autoHeight: false,// 自动判断下方是否有物体
displayMode: 2,//显示模式
clusterByImage: true,// 聚合时是否根据图片路径分类，即当多个marker的imagePath路径参数相同时按路径对marker分类聚合
priority: 0,//避让优先级
occlusionCull: false//是否参与遮挡剔除
}
//楼关系odline
const odline = {
id: 'odline' + index + i,//ODLine唯一标识
color: [254 / 255, 222 / 255, 118 / 255, 1],//填充颜色
coordinates: [children.markerCoor, randomRelationshipObjArr[index].markerCoor,],//构成ODLine的坐标点数组
flowRate: 1.5, //流速
intensity: 15, //亮度
bendDegree: 0.5, //弯曲度
tiling: 0.8, //材质贴图平铺比例
lineThickness: 2, //折线宽度
labelSizeScale: 5, //两端点的缩放值
lineShape: 1, //ODLine模型样式 0:平面 1:柱体，默认值1
lineStyle: 0, //ODLine材质样式 0:纯色 1:箭头，2:流动点，默认值0
flowShape: 1, //ODLine发光点样式 0:无 1:球体，默认值0
flowPointSizeScale: 10, //(number) 运动点的缩放值，默认值20， 单位米
startPointShape: 1, //点的样式
endPointShape: 0, //点的样式
startLabelShape: 0, //点的样式
endLabelShape: 0 //点的样式
}
markerArr.push(markerChildren)
polygon3dArr.push(polygon3dChildren)
odlineArr.push(odline)
needDelete3dPolygonArr.push('RelationshipOfArchitecture_children_' + index + i)
needDeleteMarkerArr.push('mansion_children_' + index + i)
needDeleteodlineArr.push('odline' + index + i)
})
await __g.polygon3d.add(polygon3dArr)
await __g.marker.add(markerArr);
await __g.odline.add(odlineArr);
}
四：去components/aircityutils/Event.ts 写上点击事件，以及传回id，
if (e.Type === '3dPolygon') {
if (e.GroupID?.includes('RelationshipOfArchitecture')) {
await handleDeletePolygon3d()
}
if (e.GroupID?.includes('initializeBuild_')) {
if (recordClickObj == e.GroupID && active) {
active = false
await handleDeletePolygon3d()
return
}
recordClickObj = e.GroupID
active = true
await handleClickPolygon3d(e.GroupID as string)
}
}以上就是整体思路了，下面上效果图及全部代码：
效果图
代码;
const buildCoordinates = [
{
name: '杭州大剧院',
coor: [[520321.34375, 3347341.5, 7.143584], [520344.90625, 3347359, 7.143564], [520355.375, 3347369, 7.143642], [520385.71875, 3347399, 7.343637], [520399, 3347426.25, 7.343643], [520406.09375, 3347453.25, 8.343623], [520407.1875, 3347480.75, 7.143638], [520404.3125, 3347501.75, 7.143642], [520385.5, 3347529.75, 7.143652], [520346.875, 3347554.5, 7.143642], [520310.65625, 3347563, 7.143652], [520284.0625, 3347556.75, 8.743203], [520247.3125, 3347535.5, 7.342915], [520216.1875, 3347505.5, 7.343643], [520199.84375, 3347483.75, 7.143603], [520190.28125, 3347464, 7.143603], [520184.75, 3347421, 7.143603], [520188.03125, 3347383.25, 7.143613], [520216.90625, 3347341.5, 7.143652], [520258.53125, 3347326.25, 7.143623], [520295.25, 3347330, 7.143594], [520321.625, 3347341, 7.143603]],
markerCoor: [520272.25, 3347428.75, 65.1435546875],
},
{
name: '杭州国际会议中心',
coor: [[520094.71875, 3347213.25, 7.965303], [520106.6875, 3347201.5, 7.974199], [520119.78125, 3347191.75, 7.974189], [520128.875, 3347187.5, 7.253623], [520141.96875, 3347183.75, 7.143642], [520163.28125, 3347179.5, 8.234697], [520179.0625, 3347180, 7.643642], [520191.5, 3347180.75, 7.643638], [520200.0625, 3347183.5, 7.643589], [520211.21875, 3347187, 7.143701], [520220.84375, 3347192.5, 7.143633], [520231.25, 3347202.75, 7.143613], [520241.84375, 3347219.25, 7.143642], [520246.3125, 3347229.25, 7.643642], [520249.3125, 3347240, 7.983633], [520250.1875, 3347253.75, 7.74877], [520247.71875, 3347269.75, 7.655859], [520243.96875, 3347282.5, 7.665488], [520237.75, 3347299.5, 7.143652], [520227.8125, 3347313, 7.143672], [520215.65625, 3347323.75, 7.143672], [520198.34375, 3347336.5, 7.143692], [520179.6875, 3347345, 7.143633], [520157.9375, 3347349.5, 7.143642], [520137.1875, 3347349.75, 8.386972], [520119.375, 3347345.75, 7.580869], [520103.09375, 3347339.5, 7.143731], [520084.34375, 3347327.5, 7.143808], [520074.34375, 3347310.5, 7.143711], [520068.5, 3347298, 7.543398], [520066.4375, 3347277, 7.543374], [520069.625, 3347261.25, 8.319223], [520073.59375, 3347250.25, 7.98771], [520077.59375, 3347238.75, 7.703955], [520084.0625, 3347226.75, 7.280176], [520094.125, 3347213.5, 7.253769]],
markerCoor: [520164.75, 3347266.5, 98.941546630859375]
},
{
name: 'UDC时代大厦',
coor: [[520315.40625, 3347709.5, 7.343652], [520334.65625, 3347672.5, 7.343633], [520379.15625, 3347636.75, 7.543613], [520413.09375, 3347623.25, 7.343633], [520423.0625, 3347627, 7.343691], [520441.65625, 3347677.25, 7.343672], [520349.625, 3347747, 15.355078], [520316, 3347710.25, 7.343789]],
markerCoor: [520379.59375, 3347685, 147.355097770690918]
},
{
name: '宏程国际大厦',
coor: [[520465.09375, 3347685.75, 7.343623], [520526.625, 3347758.75, 8.043633], [520477.25, 3347791, 7.343643], [520421.875, 3347717.5, 15.355068], [520464.6875, 3347685.5, 7.343643]],
markerCoor: [520459.46875, 3347722.75, 165.53768920898438]
},
{
name: '迪凯国际中心',
coor: [[520347.1875, 3347767.5, 7.343633], [520398.4375, 3347730, 15.355088], [520400.09375, 3347728.5, 15.355088], [520462.875, 3347810.5, 8.043643], [520414.78125, 3347842.5, 7.543643], [520348.1875, 3347768, 7.343643]],
markerCoor: [520426.78125, 3347804, 145.89244079589844],
},
{
name: '杭州来福士中心',
coor: [[520010.90625, 3347918.25, 7.143164], [520039.34375, 3347902.5, 7.322852], [520064.4375, 3347906.25, 7.613633], [520099.78125, 3347926.5, 6.989121], [520125.71875, 3347944.25, 6.891289], [520161.5, 3347939.25, 7.143145], [520187.875, 3347950.25, 7.299785], [520209.46875, 3347985.25, 6.980879], [520199.15625, 3348006.5, 7.343125], [520158.875, 3348017.5, 7.143106], [520140.1875, 3348010.25, 6.890967], [520132.90625, 3347997.25, 6.829297], [520111.96875, 3347984.25, 6.671758], [520083.625, 3347965.5, 6.676485], [520043.40625, 3347978, 6.905488], [520024.46875, 3347963.75, 7.062988], [520007.8125, 3347942.5, 6.949141], [520012.15625, 3347918.75, 7.143086]],
markerCoor: [520043.15625, 3347938, 250.80831909179688],
},
{
name: '杭州市人民政府',
coor: [[519814.375, 3347473.5, 8.522051], [520030.6875, 3347759, 8.49918], [519742.96875, 3347970.25, 8.800019], [519537.65625, 3347686, 8.686954], [519811.25, 3347472, 8.579571]],
markerCoor: [519782.5, 3347716.25, 112.121326446533203]
},
{
name: '杭州市国际中心',
coor: [[520230.03125, 3348037.25, 7.343125], [520246.75, 3348055, 7.238584], [520278.3125, 3348097.25, 7.237295], [520301.40625, 3348129.75, 7.436865], [520240.125, 3348180, 7.443985], [520181.875, 3348222.25, 7.343125], [520139.78125, 3348194, 7.343144], [520108.96875, 3348146.75, 7.343144], [520152.75, 3348097.5, 7.274844], [520228.71875, 3348037, 7.343418]],
markerCoor: [520198.90625, 3348141.75, 273.964961051940918]
},
{
name: '中国人寿大厦',
coor: [[519807.375, 3348054, 7.442383], [519860.78125, 3348016.75, 7.343164], [519897.75, 3348077, 8.425508], [519848.53125, 3348110, 7.270898], [519807.21875, 3348054.25, 7.431894]],
markerCoor: [519863.78125, 3348072.5, 175.4329833984375]
},
{
name: '杭州钓鱼台酒店',
coor: [[520016.28125, 3346870.75, 10.578906], [520028.9375, 3346893, 26.231855], [520019.71875, 3346892.25, 7.383164], [520058.78125, 3346972.5, 21.102911], [520048.4375, 3346977.5, 21.102911], [520082.375, 3347041, 7.634727], [520092.28125, 3347035.25, 7.763613], [520117.15625, 3347051, 7.50709], [520127.96875, 3347044.25, 7.506607], [520131.1875, 3347047.5, 8.235205], [520160.6875, 3347024.75, 9.70289], [520157.75, 3347016.25, 9.794336], [520138.34375, 3346999.25, 7.815269], [520142.03125, 3346990.75, 9.769306], [520139.03125, 3346979.75, 9.757939], [520131.71875, 3346969.75, 27.081615], [520123.5625, 3346965.25, 21.10288], [520117.09375, 3346963.25, 21.10288], [520110.46875, 3346940.5, 21.10289], [520107.625, 3346933, 9.71207], [520065.71875, 3346865.75, 9.644384], [520056.75, 3346870.5, 8.043633], [520049.25, 3346858.75, 13.847886], [520048.375, 3346856.75, 13.84332], [520026.625, 3346873.25, 26.231836]],
markerCoor: [520108.71875, 3346990.75, 97.368545532226563]
},
{
name: '泛海国际中心',
coor: [[520010.65625, 3346934.5, 6.843399], [520059.78125, 3347012, 7.348672], [519870.96875, 3347154.75, 7.143145], [519816.5625, 3347083.25, 7.54206], [520012.65625, 3346937.5, 6.843399]],
markerCoor: [519947.0625, 3347056, 155.04203796386719]
},
{
name: '迪拜银座',
coor: [[519932.78125, 3347117.25, 7.342207], [519993.09375, 3347194.75, 7.542129], [519995.5625, 3347200.25, 7.542099], [519946.125, 3347236.75, 7.604209], [519885.15625, 3347157, 7.342207], [519882.4375, 3347153.5, 7.344687], [519931.8125, 3347117.25, 7.344473]],
markerCoor: [519956.09375, 3347190.75, 154.48291015625]
},
{
name: '财富金融中心',
coor: [[519811.90625, 3347147.75, 7.342558], [519824.3125, 3347150.5, 7.342686], [519834.90625, 3347164.25, 7.342539], [519835.90625, 3347184.75, 7.143125], [519836.3125, 3347192.25, 7.37334], [519841.875, 3347198, 2.690146], [519846.4375, 3347208.75, 3.204619], [519861.90625, 3347210.25, 7.342558], [519875.125, 3347219.25, 7.342695], [519887.8125, 3347235.5, 7.342637], [519888.25, 3347252.25, 7.342568], [519875.5625, 3347263.25, 7.342578], [519848.1875, 3347265.75, 7.342568], [519832.15625, 3347259.5, 14.212578], [519822.3125, 3347253.25, 14.212568], [519814.09375, 3347241.75, 5.143618], [519813.1875, 3347230, 5.143633], [519814.25, 3347224.25, 5.143642], [519810.46875, 3347220.75, 7.143145], [519796.84375, 3347219.75, 7.143145], [519792.875, 3347215.5, 14.896763], [519783.28125, 3347203.25, 7.14314], [519781.65625, 3347188, 5.143638], [519784.03125, 3347174, 7.342554], [519791.53125, 3347161.25, 14.896758], [519798.5625, 3347153, 7.342568], [519811.875, 3347147.75, 7.342573]],
markerCoor: [519841.09375, 3347202.5, 231.514904022216797]
},
{
name: '高德置地广场',
coor: [[519640.46875, 3347242.25, 7.263652], [519736.125, 3347373, 7.263789], [519614.75, 3347455.75, 7.263848], [519523.78125, 3347325.5, 7.263633], [519639.5625, 3347242, 7.263633]],
markerCoor: [519625.09375, 3347347.75, 154.640899658203125]
},
{
name: '华联·全景天地',
coor: [[520521.78125, 3347608, 7.120185], [520524.9375, 3347598.25, 7.127754], [520534.65625, 3347585.5, 7.17333], [520549.3125, 3347587.25, 7.224443], [520552, 3347595.5, 7.238857], [520554.65625, 3347606, 7.255781], [520559.28125, 3347616.75, 7.739346], [520565.34375, 3347625.25, 8.373643], [520572.40625, 3347631.25, 9.611807], [520578.5, 3347636.5, 8.723332], [520584.71875, 3347640.75, 7.978096], [520589.46875, 3347643.5, 8.220063], [520592.09375, 3347646, 7.49625], [520589.96875, 3347662.5, 7.481626], [520579.34375, 3347666.5, 7.408579], [520569.0625, 3347667.25, 7.344351], [520550.0625, 3347663.75, 7.253867], [520541.375, 3347655, 7.229248], [520540.75, 3347644.5, 7.204004], [520547.46875, 3347641.75, 7.234438], [520543.625, 3347632.75, 7.220757], [520537.5, 3347634.25, 7.205908], [520527.65625, 3347632.75, 7.172348], [520522.78125, 3347628.75, 7.160166], [520520.90625, 3347621.5, 7.148633], [520519.75, 3347615.5, 7.129478], [520522.125, 3347608, 7.121523]],
markerCoor: [520553.65625, 3347630.25, 105.709121704101563]
},
{
name: 'UDC·钱塘会馆',
coor: [[520565.75, 3347677.25, 7.309375], [520574.96875, 3347675, 7.371758], [520585.0625, 3347674.75, 7.439482], [520596.875, 3347675.75, 7.539804], [520609.125, 3347682.25, 7.649072], [520609.625, 3347699.5, 7.593125], [520597.65625, 3347703.25, 7.486377], [520580.09375, 3347702.75, 7.34876], [520570.09375, 3347700.5, 7.288926], [520562.0625, 3347696.5, 7.258213], [520561.34375, 3347684, 7.284243], [520560.9375, 3347679.5, 7.274712], [520565.8125, 3347677.5, 7.309688]],
markerCoor: [520584.3125, 3347690.75, 105.852775573730469]
},
{
name: '迪凯金座',
coor: [[520309.0625, 3347799.75, 7.343652], [520323.8125, 3347817, 7.343633], [520335.90625, 3347811, 7.343672], [520380.8125, 3347871.25, 7.343789], [520324.03125, 3347912.5, 7.343672], [520264.59375, 3347835.25, 7.343633], [520309.21875, 3347800, 7.343643]],
markerCoor: [520309.5625, 3347864.25, 210.24496459960938]
},
{
name: '华峰国际',
coor: [[520205.46875, 3347765.25, 7.343906], [520267.5, 3347717, 7.343711], [520313.21875, 3347777.25, 7.343613], [520248.5625, 3347827, 7.343633], [520205.53125, 3347765.25, 7.343906]],
markerCoor: [520256.34375, 3347743.75, 152.99903869628906]
},
]
export const randomNum = (min: number, max: number) =>
Math.floor(Math.random() * (max - min + 1)) + min;
const getRandomArr = (arr: any, length: number, oneself: number) => //arr为可能出现的元素集合
{
const randomArr = JSON.parse(JSON.stringify(arr))
randomArr.splice(oneself, 1)
// console.log(randomArr, 'aiaiaiaiaiaiaiaiia');
const temp = new Array(); //temp存放生成的随机数组
const count = length;
for (let i = 0; i < count; i++) {
const num = Math.floor(Math.random() * randomArr.length); //生成随机数num
temp.push(randomArr[num]); //获取arr[num]并放入temp
randomArr.splice(num, 1);
}
return temp;
}
const randomRelationshipObjArr = JSON.parse(JSON.stringify(buildCoordinates))
buildCoordinates.forEach((item: any, index: number) => {
const cord = randomNum(2, 4)
const randomRelationshipArr = getRandomArr(buildCoordinates, cord, index)
randomRelationshipObjArr[index].children = randomRelationshipArr
})
export { randomRelationshipObjArr, buildCoordinates }
import { useAirCityStore } from '@/stores/aircity'
import { randomRelationshipObjArr, buildCoordinates } from '../data/buildCoordinates'
const aircity = useAirCityStore()
// 存储需要删除的3dPolygon
const needDelete3dPolygonArr: any = []
// 存储需要删除的Marker
const needDeleteMarkerArr: any = []
// 存储需要删除的odline
const needDeleteodlineArr: any = []
export const initRelationshipOfArchitecture = async () => {
await __g.camera.stopAnimation()
await __g.weather.setDateTime(2022, 9, 9, 12, 8, false);
await __g.camera.set([519129.865391, 3348022.749688, 926.177031, -41.776329, 36.266415, 0.5])
await __g.weather.setDarkMode(false)
// await __g.infoTree.hide(aircity.layerTreeObject['杭州地图'])
await __g.infoTree.show([aircity.layerTreeObject['杭州日月同辉'], aircity.layerTreeObject['1206'], aircity.layerTreeObject['杭州地形']])
await __g.tileLayer.setCollision(aircity.layerTreeObject['杭州日月同辉'], true, true, false, false)
await __g.tileLayer.setCollision(aircity.layerTreeObject['1206'], true, true, false, false)
await addAllPolygon3d()
}
export const clearRelationshipOfArchitecture = async () => {
await __g.polygon3d.clear(null)
await __g.marker.clear(null)
await __g.odline.clear(null)
await __g.tileLayer.setCollision(aircity.layerTreeObject['杭州日月同辉'], true, true, true, true)
await __g.tileLayer.setCollision(aircity.layerTreeObject['1206'], true, true, true, true)
}
export const handleDeletePolygon3d = async () => {
await __g.polygon3d.delete(needDelete3dPolygonArr),
await __g.marker.delete(needDeleteMarkerArr)
await __g.odline.delete(needDeleteodlineArr)
}
//点击楼
export const handleClickPolygon3d = async (groupId: string) => {
await handleDeletePolygon3d()
const markerArr: any = []
const polygon3dArr: any = []
const odlineArr: any = []
const index = Number(groupId.slice(groupId.lastIndexOf('_') + 1))
//点击的楼的polygon3d
const polygon3d = {
id: 'RelationshipOfArchitecture_' + index,
coordinates: randomRelationshipObjArr[index].coor,
groupId: 'RelationshipOfArchitecture_' + index,
color: [0 / 255, 218 / 255, 232 / 255, 0.6], //颜色值
height: randomRelationshipObjArr[index].markerCoor[2], //3D多边形的高度
intensity: 1.0, //亮度
style: 1, //3DPolygon的样式 请参照API开发文档选取枚举
tillingX: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图横向平铺
tillingY: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图纵向平铺
// material: "/JC_CustomAssets/MaterialLibrary/Exhibition/地面_人造/地面_人造_13", //自定义材质路径
scalarParameters: [{ "name": "亮度", "value": 1.0 }], //材质数值类型参数
vectorParameters: [{ "name": "颜色", "value": [1, 1, 1] }], //材质数组类型参数
generateTop: true, //是否生成顶面
generateSide: true,//是否生成侧面
generateBottom: false//是否生成底面
};
//点击的楼的marker
const marker = {
id: 'RelationshipOfArchitecture_Marker_' + index,
groupId: 'markerAdd',
coordinate: randomRelationshipObjArr[index].markerCoor,//坐标位置
coordinateType: 0,//默认0是投影坐标系，也可以设置为经纬度空间坐标系值为1
anchors: [-25, 50],//锚点，设置Marker的整体偏移，取值规则和imageSize设置的宽高有关，图片的左上角会对准标注点的坐标位置。示例设置规则：x=-imageSize.width/2，y=imageSize.height
imageSize: [50, 70],//图片的尺寸
hoverImageSize: [55, 77],//鼠标悬停时显示的图片尺寸
range: [1, 100000],//可视范围
imagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',//显示图片路径
hoverImagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',// 鼠标悬停时显示的图片路径
fixedSize: true,//图片固定尺寸，取值范围：false 自适应，近大远小，true 固定尺寸，默认值：false
text: randomRelationshipObjArr[index].name,//显示的文字
useTextAnimation: true,//打开文字展开动画效果
textRange: [1, 1000000],//文本可视范围[近裁距离, 远裁距离]
textOffset: [0, 0],// 文本偏移
textBackgroundColor: [0, 0, 1, 0.5],//文本背景颜色
fontSize: 20,//字体大小
fontOutlineSize: 1,//字体轮廓线大小
fontColor: Color.White,//字体颜色
fontOutlineColor: Color.Black,//字体轮廓线颜色
popupURL: `@path:智慧杭州/customTag/university.html`,//弹窗HTML链接
popupBackgroundColor: [1.0, 1.0, 1.0, 0.5],//弹窗背景颜色
popupSize: [600, 400],//弹窗大小
popupOffset: [0, 0],//弹窗偏移
showLine: false,//标注点下方是否显示垂直牵引线
lineSize: [2, 100],//垂直牵引线宽度和高度[width, height]
lineColor: Color.SpringGreen,//垂直牵引线颜色
lineOffset: [0, 0],//垂直牵引线偏移
autoHidePopupWindow: true,//失去焦点后是否自动关闭弹出窗口
autoHeight: false,// 自动判断下方是否有物体
displayMode: 2,//显示模式
clusterByImage: true,// 聚合时是否根据图片路径分类，即当多个marker的imagePath路径参数相同时按路径对marker分类聚合
priority: 0,//避让优先级
occlusionCull: false//是否参与遮挡剔除
}
markerArr.push(marker)
polygon3dArr.push(polygon3d)
needDelete3dPolygonArr.push('RelationshipOfArchitecture_' + index)
needDeleteMarkerArr.push('RelationshipOfArchitecture_Marker_' + index)
randomRelationshipObjArr[index].children.forEach((children: any, i: number) => {
//点击楼的关系楼的polygon3d
const polygon3dChildren = {
id: 'RelationshipOfArchitecture_children_' + index + i,
coordinates: children.coor,
groupId: 'RelationshipOfArchitecture_children_' + index,
color: [241 / 255, 123 / 255, 3 / 255, 0.7], //颜色值
height: children.markerCoor[2], //3D多边形的高度
intensity: 1.0, //亮度
style: 1, //3DPolygon的样式 请参照API开发文档选取枚举
tillingX: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图横向平铺
tillingY: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图纵向平铺
// material: "/JC_CustomAssets/MaterialLibrary/Exhibition/地面_人造/地面_人造_13", //自定义材质路径
scalarParameters: [{ "name": "亮度", "value": 1.0 }], //材质数值类型参数
vectorParameters: [{ "name": "颜色", "value": [1, 1, 1] }], //材质数组类型参数
generateTop: true, //是否生成顶面
generateSide: true,//是否生成侧面
generateBottom: false//是否生成底面
};
//点击楼的关系楼的marker
const markerChildren = {
id: 'mansion_children_' + index + i,
groupId: 'markerAdd',
coordinate: children.markerCoor,//坐标位置
coordinateType: 0,//默认0是投影坐标系，也可以设置为经纬度空间坐标系值为1
anchors: [-25, 50],//锚点，设置Marker的整体偏移，取值规则和imageSize设置的宽高有关，图片的左上角会对准标注点的坐标位置。示例设置规则：x=-imageSize.width/2，y=imageSize.height
imageSize: [50, 70],//图片的尺寸
hoverImageSize: [55, 77],//鼠标悬停时显示的图片尺寸
range: [1, 100000],//可视范围
imagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',//显示图片路径
hoverImagePath: '@path:智慧杭州/map_spot_shidianxiaoqu.png',// 鼠标悬停时显示的图片路径
fixedSize: true,//图片固定尺寸，取值范围：false 自适应，近大远小，true 固定尺寸，默认值：false
text: children.name,//显示的文字
useTextAnimation: true,//打开文字展开动画效果
textRange: [1, 1000000],//文本可视范围[近裁距离, 远裁距离]
textOffset: [0, 0],// 文本偏移
textBackgroundColor: [0, 1, 0, 0.5],//文本背景颜色
fontSize: 18,//字体大小
fontOutlineSize: 1,//字体轮廓线大小
fontColor: Color.White,//字体颜色
fontOutlineColor: Color.Black,//字体轮廓线颜色
popupURL: `@path:智慧杭州/customTag/university.html`,//弹窗HTML链接
popupBackgroundColor: [1.0, 1.0, 1.0, 0.5],//弹窗背景颜色
popupSize: [600, 400],//弹窗大小
popupOffset: [0, 0],//弹窗偏移
autoHidePopupWindow: true,//失去焦点后是否自动关闭弹出窗口
autoHeight: false,// 自动判断下方是否有物体
displayMode: 2,//显示模式
clusterByImage: true,// 聚合时是否根据图片路径分类，即当多个marker的imagePath路径参数相同时按路径对marker分类聚合
priority: 0,//避让优先级
occlusionCull: false//是否参与遮挡剔除
}
//楼关系odline
const odline = {
id: 'odline' + index + i,//ODLine唯一标识
color: [254 / 255, 222 / 255, 118 / 255, 1],//填充颜色
coordinates: [children.markerCoor, randomRelationshipObjArr[index].markerCoor,],//构成ODLine的坐标点数组
flowRate: 1.5, //流速
intensity: 15, //亮度
bendDegree: 0.5, //弯曲度
tiling: 0.8, //材质贴图平铺比例
lineThickness: 2, //折线宽度
labelSizeScale: 5, //两端点的缩放值
lineShape: 1, //ODLine模型样式 0:平面 1:柱体，默认值1
lineStyle: 0, //ODLine材质样式 0:纯色 1:箭头，2:流动点，默认值0
flowShape: 1, //ODLine发光点样式 0:无 1:球体，默认值0
flowPointSizeScale: 10, //(number) 运动点的缩放值，默认值20， 单位米
startPointShape: 1, //点的样式
endPointShape: 0, //点的样式
startLabelShape: 0, //点的样式
endLabelShape: 0 //点的样式
}
markerArr.push(markerChildren)
polygon3dArr.push(polygon3dChildren)
odlineArr.push(odline)
needDelete3dPolygonArr.push('RelationshipOfArchitecture_children_' + index + i)
needDeleteMarkerArr.push('mansion_children_' + index + i)
needDeleteodlineArr.push('odline' + index + i)
})
await __g.polygon3d.add(polygon3dArr)
await __g.marker.add(markerArr);
await __g.odline.add(odlineArr);
}
//给所有楼添加一层透明的3dplygon
const addAllPolygon3d = async () => {
const polygon3dArr: any = []
buildCoordinates.forEach(async (item: any, index: number) => {
const polygon3d = {
id: 'initRelationshipOfArchitecture_' + index,
groupId: 'initializeBuild_' + index,
coordinates: item.coor,
color: [0 / 255, 218 / 255, 232 / 255, 0], //颜色值
height: item.markerCoor[2], //3D多边形的高度
intensity: 1.0, //亮度
style: 1, //3DPolygon的样式 请参照API开发文档选取枚举
tillingX: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图横向平铺
tillingY: 0, //可选，仅当3DPolygon的样式支持贴图显示，贴图纵向平铺
// material: "/JC_CustomAssets/MaterialLibrary/Exhibition/地面_人造/地面_人造_13", //自定义材质路径
scalarParameters: [{ "name": "亮度", "value": 1.0 }], //材质数值类型参数
vectorParameters: [{ "name": "颜色", "value": [1, 1, 1] }], //材质数组类型参数
generateTop: true, //是否生成顶面
generateSide: true,//是否生成侧面
generateBottom: false//是否生成底面
};
polygon3dArr.push(polygon3d)
})
await __g.polygon3d.add(polygon3dArr)
}
4026
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
