1. 这个不觉明历。在我看来，这和 boxs 那个例子差不多。
2. 只不过扩展类 TestBoxs 继承了 maptalks.MergedMixin ，这个估计要看源码才能明白是啥了。
1 class TestBoxs extends maptalks.MergedMixin(maptalks.BaseObject) { 2 constructor(points, options, material, layer) { 3 if (!Array.isArray(points)) { 4 points = [points]; 5 } 6 const len = points.length; 7 const center = getCenterOfPoints(points); 8 const centerPt = layer.coordinateToVector3(center); 9 const geometries = [], bars = [], geometriesAttributes = [], faceMap = []; 10 let faceIndex = 0, psIndex = 0, normalIndex = 0, uvIndex = 0; 11 for (let i = 0; i < len; i++) { 12 const opts = maptalks.Util.extend({ index: i }, OPTIONS1, points[i]); 13 const { radius, altitude, topColor, bottomColor, height, coordinate } = opts; 14 const r = layer.distanceToVector3(radius, radius).x; 15 const h = layer.distanceToVector3(height, height).x; 16 const alt = layer.distanceToVector3(altitude, altitude).x; 17 const buffGeom = defaultGeometry.clone(); 18 buffGeom.scale(r * 2, r * 2, h); 19 const v = layer.coordinateToVector3(coordinate).sub(centerPt); 20 const parray = buffGeom.attributes.position.array; 21 for (let j = 0, len1 = parray.length; j < len1; j += 3) { 22 parray[j + 2] += alt; 23 parray[j] += v.x; 24 parray[j + 1] += v.y; 25 parray[j + 2] += v.z; 26 } 27 const position = buffGeom.attributes.position; 28 const normal = buffGeom.attributes.normal; 29 const uv = buffGeom.attributes.uv; 30 const index = buffGeom.index; 31 geometries.push({ 32 position: position.array, 33 normal: normal.array, 34 uv: uv.array, 35 indices: index.array 36 }); 37 const bar = new TestBox(coordinate, opts, material, layer); 38 bars.push(bar); 39 40 const faceLen = buffGeom.index.count / 3; 41 faceMap[i] = [faceIndex + 1, faceIndex + faceLen]; 42 faceIndex += faceLen; 43 44 const psCount = buffGeom.attributes.position.count, 45 // colorCount = buffGeom.attributes.color.count, 46 normalCount = buffGeom.attributes.normal.count, uvCount = buffGeom.attributes.uv.count; 47 geometriesAttributes[i] = { 48 position: { 49 count: psCount, 50 start: psIndex, 51 end: psIndex + psCount * 3, 52 }, 53 normal: { 54 count: normalCount, 55 start: normalIndex, 56 end: normalIndex + normalCount * 3, 57 }, 58 // color: { 59 // count: colorCount, 60 // start: colorIndex, 61 // end: colorIndex + colorCount * 3, 62 // }, 63 uv: { 64 count: uvCount, 65 start: uvIndex, 66 end: uvIndex + uvCount * 2, 67 }, 68 hide: false 69 }; 70 psIndex += psCount * 3; 71 normalIndex += normalCount * 3; 72 // colorIndex += colorCount * 3; 73 uvIndex += uvCount * 2; 74 } 75 super(); 76 options = maptalks.Util.extend({}, { altitude: 0, layer, points }, options); 77 this._initOptions(options); 78 const geometry = maptalks.MergeGeometryUtil.mergeBufferGeometries(geometries); 79 this._createMesh(geometry, material); 80 const altitude = options.altitude; 81 const z = layer.distanceToVector3(altitude, altitude).x; 82 const v = centerPt.clone(); 83 v.z = z; 84 this.getObject3d().position.copy(v); 85 86 this._faceMap = faceMap; 87 this._baseObjects = bars; 88 this._datas = points; 89 this._geometriesAttributes = geometriesAttributes; 90 this.faceIndex = null; 91 this._geometryCache = geometry.clone(); 92 this.isHide = false; 93 this._colorMap = {}; 94 this._initBaseObjectsEvent(bars); 95 this._setPickObject3d(); 96 this._init(); 97 } 98 99 // eslint-disable-next-line no-unused-vars 100 identify(coordinate) { 101 return this.picked; 102 } 103 }
3. 页面显示
4. 源码地址
https://github.com/WhatGIS/maptalkMap/tree/main/threelayer/demo