gis-view-webgl2 0.1.12 → 0.1.13

package/docs/steps/selftest-features.html

@@ -3589,6 +3589,7 @@ check('beginAddChannel({ lineData })：草稿按第二段对齐条数（circuits
 						cmSend(casView, 'pointerup', screen, { buttons: 0, button: 0, ...extra })
 						await settle(60)
 					}
+					const casWait = ms => new Promise(resolve => setTimeout(resolve, ms))
 					await casClick(casView.project(0, 0))
 					const casPointInfo = casView.getCascadeHighlight()
 					check('级联高亮：点节点亮自身与直连线路 / 另一端节点（默认 both）',
@@ -3721,6 +3722,39 @@ check('beginAddChannel({ lineData })：草稿按第二段对齐条数（circuits
 					casView.selectInBox({ x: casBoxD[0] - 30, y: casBoxD[1] - 30, width: 60, height: 60 }, { selectionKinds: ['point'] })
 					check('triggerOnBoxSelect: false（缺省）：框选只改选中集并收掉旧级联', casView.getCascadeHighlight() === null, JSON.stringify(casView.getCascadeHighlight()))
 
+					// 取消选中时级联一起收掉：toggleSelect 的取消只发一条 null，接口取消也走同一口径
+					casView.updateOptions({ toggleSelect: true, cascadeHighlight: { scope: 'both', triggerOnClick: true, triggerOnMultiSelect: true } })
+					casView.selectFeatures(null)
+					await settle(120)
+					await casClick(casView.project(0, 0))
+					await casWait(360)
+					casEvents.length = 0
+					casBusEvents.length = 0
+					await casClick(casView.project(0, 0))
+					check('toggleSelect 取消选中：级联同步收掉，且这一击只发一条 null',
+						casView.getSelectionData().count === 0 && casView.getCascadeHighlight() === null && casEvents.length === 1 && casEvents[0] === null,
+						JSON.stringify({ selected: casView.getSelectionData().count, cascade: casView.getCascadeHighlight(), events: casEvents }))
+
+					await casWait(360)
+					await casClick(casView.project(0, 0))
+					casEvents.length = 0
+					casBusEvents.length = 0
+					casView.deselect('cas-a')
+					await settle(60)
+					check('deselect 取消级联来源：级联同步收掉并只发一条 null',
+						casView.getSelectionData().count === 0 && casView.getCascadeHighlight() === null && casEvents.length === 1 && casEvents[0] === null,
+						JSON.stringify({ selected: casView.getSelectionData().count, cascade: casView.getCascadeHighlight(), events: casEvents }))
+
+					await casWait(360)
+					await casClick(casView.project(0, 0))
+					casEvents.length = 0
+					casBusEvents.length = 0
+					casView.selectFeatures('cas-a', { mode: 'remove' })
+					await settle(60)
+					check('selectFeatures remove 取消级联来源：级联同步收掉并只发一条 null',
+						casView.getSelectionData().count === 0 && casView.getCascadeHighlight() === null && casEvents.length === 1 && casEvents[0] === null,
+						JSON.stringify({ selected: casView.getSelectionData().count, cascade: casView.getCascadeHighlight(), events: casEvents }))
+
 					casEvents.length = 0
 					casView.updateOptions({ cascadeHighlight: false })
 					await settle(60)
@@ -6827,6 +6861,708 @@ check('beginAddChannel({ lineData })：草稿按第二段对齐条数（circuits
 				interactionPriorityView.destroy()
 				interactionPriorityHost.remove()
 
+				/* ---------------- visualMap 图例：连续尺 / 分段色块 / 懒挂载 / 数据值域 ---------------- */
+				const visualMapHost = document.createElement('div')
+				visualMapHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapHost)
+				const visualMapView = createGisView(visualMapHost, {
+					points: [
+						{ id: 'vm-a', x: 0, y: 0, name: '甲', value: 0 },
+						{ id: 'vm-b', x: 60, y: 20, name: '乙', value: 10 },
+						{ id: 'vm-c', x: 120, y: 0, name: '丙', value: 20 }
+					],
+					heatmap: { target: 'point', field: 'value', density: false, glow: false, opacity: 1 },
+					visualMap: { target: 'point', title: '负荷', unit: 'kW', tickCount: 3 },
+					label: { content: '{name}' },
+					showGrid: false
+				})
+				await settle(80)
+				const visualMapElement = visualMapView.getVisualMapElement()
+				const visualMapReadout = visualMapView.getVisualMap()
+				check('visualMap：默认跟随 heatmap 的字段与自动值域', visualMapReadout?.field === 'value' && visualMapReadout.domain[0] === 0 && visualMapReadout.domain[1] === 20 && visualMapReadout.type === 'ruler', JSON.stringify(visualMapReadout))
+				check('visualMap：连续尺有渐变、刻度与单位', Boolean(visualMapElement && visualMapHost.contains(visualMapElement)) && visualMapElement.querySelectorAll('.gis-view__visual-map-tick').length === 3 && visualMapElement.querySelector('.gis-view__visual-map-ruler')?.style.background.includes('gradient') && visualMapReadout.ticks[0].label.includes('kW'), visualMapReadout?.ticks?.map(tick => tick.label).join(' / '))
+				const visualMapLabelLayer = visualMapHost.querySelector('.gis-view__labels')
+				let visualMapLabelMutations = 0
+				const visualMapLabelObserver = new MutationObserver(records => { visualMapLabelMutations += records.length })
+				if (visualMapLabelLayer) {
+					visualMapLabelObserver.observe(visualMapLabelLayer, { subtree: true, childList: true, attributes: true, characterData: true })
+				}
+				let visualMapRootMutations = 0
+				const visualMapRootObserver = new MutationObserver(records => { visualMapRootMutations += records.length })
+				visualMapRootObserver.observe(visualMapElement, { subtree: true, childList: true, attributes: true, characterData: true })
+				const visualMapSameConfig = { target: 'point', title: '负荷', unit: 'kW', tickCount: 3 }
+				visualMapView.updateOptions({ visualMap: visualMapSameConfig })
+				visualMapView.updateOptions({ visualMap: { ...visualMapSameConfig } })
+				await settle(80)
+				visualMapRootObserver.disconnect()
+				visualMapLabelObserver.disconnect()
+				check('visualMap：同签名重复更新零 DOM 写入', visualMapRootMutations === 0, `${visualMapRootMutations} 条 mutation`)
+				check('visualMap：只改图例不重排标签层', visualMapLabelMutations === 0 && Boolean(visualMapLabelLayer), `${visualMapLabelMutations} 条 mutation`)
+				visualMapView.updateData([
+					{ id: 'vm-a', x: 0, y: 0, name: '甲', value: 1000 },
+					{ id: 'vm-b', x: 60, y: 20, name: '乙', value: 1500 },
+					{ id: 'vm-c', x: 120, y: 0, name: '丙', value: 2000 }
+				], [])
+				await settle(80)
+				const visualMapUpdated = visualMapView.getVisualMap()
+				check('visualMap：数据变化后自动值域在图例层内更新', visualMapUpdated?.domain[0] === 1000 && visualMapUpdated.domain[1] === 2000, JSON.stringify(visualMapUpdated?.domain))
+				visualMapView.updateOptions({ heatmap: { target: 'point', field: 'value', density: false, glow: false, colors: ['#111827', '#f8fafc'], stops: [0, 1], opacity: 1 } })
+				await settle(80)
+				const visualMapInheritedGradient = visualMapElement.querySelector('.gis-view__visual-map-ruler')?.style.background
+				visualMapView.updateOptions({ heatmap: { target: 'point', field: 'value', density: false, glow: false, colors: ['#111827', '#f8fafc'], stops: [0.35, 1], opacity: 0.3 } })
+				await settle(80)
+				const visualMapChangedGradient = visualMapElement.querySelector('.gis-view__visual-map-ruler')?.style.background
+				check('visualMap：heatmap 的 stops / opacity 变化也会重画继承色带', Boolean(visualMapInheritedGradient) && visualMapChangedGradient !== visualMapInheritedGradient, `${visualMapInheritedGradient} -> ${visualMapChangedGradient}`)
+				visualMapView.updateOptions({ visualMap: { type: 'piecewise', title: '负荷分档', unit: 'kW', pieces: [{ lt: 1200, label: '低' }, { gte: 1200, color: '#dd4b2e', label: '高' }] } })
+				await settle(80)
+				const piecewiseReadout = visualMapView.getVisualMap()
+				check('visualMap：piecewise 支持 ECharts 的 lt / gte 与自定义色块', piecewiseReadout?.type === 'piecewise' && piecewiseReadout.pieces.length === 2 && piecewiseReadout.pieces[0].label === '低' && piecewiseReadout.pieces[1].color === '#dd4b2e' && visualMapHost.querySelectorAll('.gis-view__visual-map-piece').length === 2, JSON.stringify(piecewiseReadout?.pieces))
+				visualMapView.updateOptions({ visualMap: null })
+				await settle(80)
+				check('visualMap：关掉后不保留任何图例 DOM', visualMapView.getVisualMapElement() === null && visualMapView.getVisualMap() === null && !visualMapHost.querySelector('.gis-view__visual-map'))
+				visualMapView.destroy()
+				visualMapHost.remove()
+
+				const visualMapExternal = document.createElement('div')
+				visualMapExternal.style.cssText = 'width:260px;height:120px'
+				document.body.append(visualMapExternal)
+				const visualMapStandaloneHost = document.createElement('div')
+				visualMapStandaloneHost.style.cssText = 'width:480px;height:260px'
+				document.body.append(visualMapStandaloneHost)
+				const visualMapStandalone = createGisView(visualMapStandaloneHost, {
+					points: [{ id: 'vm-x', x: 0, y: 0, score: 12 }, { id: 'vm-y', x: 30, y: 0, score: 48 }],
+					visualMap: {
+						field: 'score',
+						type: 'continuous',
+						orient: 'horizontal',
+						position: 'top-right',
+						container: visualMapExternal,
+						colors: ['#2f6fd0', '#dd4b2e'],
+						formatter: '{value}{unit}',
+						unit: '分',
+						title: '评分'
+					},
+					showGrid: false
+				})
+				await settle(80)
+				const standaloneReadout = visualMapStandalone.getVisualMap()
+				check('visualMap：没有 heatmap 时也能按字段自动算独立图例', standaloneReadout?.domain[0] === 12 && standaloneReadout.domain[1] === 48 && standaloneReadout.unit === '分', JSON.stringify(standaloneReadout?.domain))
+				check('visualMap：container / continuous / horizontal / formatter 生效', visualMapStandalone.getVisualMapElement()?.parentElement === visualMapExternal && standaloneReadout.type === 'ruler' && standaloneReadout.orient === 'horizontal' && standaloneReadout.ticks[0].label === '12分', JSON.stringify({ parent: visualMapStandalone.getVisualMapElement()?.parentElement?.className, labels: standaloneReadout?.ticks?.map(tick => tick.label) }))
+				visualMapStandalone.updateOptions({ visualMap: { enabled: false } })
+				await settle(80)
+				check('visualMap：enabled: false 等同不配，外部容器也不留节点', visualMapStandalone.getVisualMapElement() === null && visualMapExternal.childElementCount === 0)
+				visualMapStandalone.destroy()
+				visualMapStandaloneHost.remove()
+				visualMapExternal.remove()
+
+				/* 值域两端都已确定时不应再为了补另一端扫数据；用 getter 直接统计字段读取次数 */
+				const visualMapFixedHost = document.createElement('div')
+				visualMapFixedHost.style.cssText = 'width:420px;height:240px'
+				document.body.append(visualMapFixedHost)
+				let visualMapFixedReads = 0
+				const visualMapFixedPoints = [{ id: 'vm-fixed-a', x: 0, y: 0 }, { id: 'vm-fixed-b', x: 40, y: 0 }]
+				for (const point of visualMapFixedPoints) {
+					Object.defineProperty(point, 'metric', {
+						enumerable: true,
+						get: () => {
+							visualMapFixedReads += 1
+							return 25
+						}
+					})
+				}
+				const visualMapFixed = createGisView(visualMapFixedHost, {
+					points: visualMapFixedPoints,
+					visualMap: { field: 'metric', domain: [0, 100] },
+					showGrid: false
+				})
+				await settle(80)
+				const visualMapFixedDomain = visualMapFixed.getVisualMap()?.domain
+				check('visualMap：显式 domain 不读数据字段', visualMapFixedReads === 0 && visualMapFixedDomain?.[0] === 0 && visualMapFixedDomain?.[1] === 100, `${visualMapFixedReads} 次字段读取 · ${JSON.stringify(visualMapFixedDomain)}`)
+				visualMapFixed.updateOptions({ visualMap: { field: 'metric', min: 0, max: 100 } })
+				await settle(80)
+				const visualMapMinMaxDomain = visualMapFixed.getVisualMap()?.domain
+				check('visualMap：min / max 两端都给定时也不扫数据', visualMapFixedReads === 0 && visualMapMinMaxDomain?.[0] === 0 && visualMapMinMaxDomain?.[1] === 100, `${visualMapFixedReads} 次字段读取 · ${JSON.stringify(visualMapMinMaxDomain)}`)
+				visualMapFixed.destroy()
+				visualMapFixedHost.remove()
+
+				const visualMapReplaceHost = document.createElement('div')
+				visualMapReplaceHost.style.cssText = 'width:420px;height:240px'
+				document.body.append(visualMapReplaceHost)
+				const visualMapReplaceConfig = { target: 'point', title: '替换后图例' }
+				const visualMapReplace = createGisView(visualMapReplaceHost, {
+					points: [{ id: 'vm-r', x: 0, y: 0, value: 5, load: 90 }],
+					heatmap: { target: 'point', field: 'load', density: false, glow: false },
+					visualMap: visualMapReplaceConfig,
+					showGrid: false
+				})
+				await settle(80)
+				const visualMapBeforeReplace = visualMapReplace.getVisualMap()
+				visualMapReplace.updateOptions({
+					points: [{ id: 'vm-r', x: 0, y: 0, value: 5, load: 90 }],
+					visualMap: visualMapReplaceConfig,
+					showGrid: false
+				}, true)
+				await settle(80)
+				const visualMapAfterReplace = visualMapReplace.getVisualMap()
+				check('visualMap：整份替换去掉 heatmap 后，图例立即改读独立字段 / 值域', visualMapBeforeReplace?.field === 'load' && visualMapAfterReplace?.field === 'value' && visualMapAfterReplace.domain[0] === 5 && visualMapAfterReplace.domain[1] === 5, JSON.stringify({ before: visualMapBeforeReplace, after: visualMapAfterReplace }))
+				visualMapReplace.destroy()
+				visualMapReplaceHost.remove()
+
+				/* visualMap：分段点选 / 键盘 / 合帧回调 / 受控选择 */
+				const visualMapInteractionHost = document.createElement('div')
+				visualMapInteractionHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapInteractionHost)
+				let visualMapChangeCount = 0
+				const visualMapChanges = []
+				const visualMapInteractionConfig = {
+					target: 'point',
+					type: 'piecewise',
+					interactive: true,
+					selectedMode: 'multiple',
+					title: '交互分档',
+					pieces: [{ lt: 5, label: '低' }, { gte: 5, lt: 15, label: '中' }, { gte: 15, label: '高' }],
+					onChange: (payload) => {
+						visualMapChangeCount += 1
+						visualMapChanges.push(payload)
+					}
+				}
+				const visualMapInteraction = createGisView(visualMapInteractionHost, {
+					points: [{ id: 'vmi-a', x: 0, y: 0, value: 1 }, { id: 'vmi-b', x: 40, y: 0, value: 10 }, { id: 'vmi-c', x: 80, y: 0, value: 20 }],
+					visualMap: visualMapInteractionConfig,
+					showGrid: false
+				})
+				await settle(80)
+				const visualMapInteractionElement = visualMapInteraction.getVisualMapElement()
+				const visualMapInteractionRows = [...visualMapInteractionElement.querySelectorAll('.gis-view__visual-map-piece')]
+				const visualMapInitialReadout = visualMapInteraction.getVisualMap()
+				check('visualMap：显式开启交互后分段可点、初始全选', visualMapInteractionElement.classList.contains('gis-view__visual-map--interactive') && getComputedStyle(visualMapInteractionElement).pointerEvents === 'auto' && visualMapInteractionRows.length === 3 && visualMapInteractionRows.every(row => row.getAttribute('role') === 'button' && row.tabIndex === 0 && row.getAttribute('aria-pressed') === 'true') && visualMapInitialReadout.selected.length === 3, JSON.stringify({ pointerEvents: getComputedStyle(visualMapInteractionElement).pointerEvents, selected: visualMapInitialReadout?.selected, roles: visualMapInteractionRows.map(row => row.getAttribute('role')) }))
+				const visualMapRow = index => visualMapInteractionElement.querySelector(`.gis-view__visual-map-piece[data-index="${index}"]`)
+				visualMapRow(0).dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				await settle(40)
+				const visualMapAfterClick = visualMapInteraction.getVisualMap()
+				check('visualMap：点击分段切换选中态并回写读数 / onChange', visualMapAfterClick.selected.join(',') === '1,2' && visualMapRow(0).classList.contains('is-unselected') && visualMapRow(0).getAttribute('aria-pressed') === 'false' && visualMapChangeCount === 1 && visualMapChanges[0].source === 'user' && visualMapChanges[0].reason === 'piece', JSON.stringify({ selected: visualMapAfterClick?.selected, count: visualMapChangeCount, payload: visualMapChanges[0] }))
+				visualMapRow(1).dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true }))
+				await settle(40)
+				const visualMapAfterKeyboard = visualMapInteraction.getVisualMap()
+				check('visualMap：分段支持 Enter / 空格键盘操作', visualMapAfterKeyboard.selected.join(',') === '2' && visualMapChangeCount === 2, JSON.stringify({ selected: visualMapAfterKeyboard?.selected, count: visualMapChangeCount }))
+				const visualMapBatchStart = visualMapChangeCount
+				visualMapRow(1).dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				visualMapRow(2).dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				visualMapRow(1).dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				await settle(40)
+				const visualMapAfterBatch = visualMapInteraction.getVisualMap()
+				check('visualMap：同一帧多次点击合并成一次 onChange', visualMapAfterBatch.selected.length === 0 && visualMapChangeCount === visualMapBatchStart + 1, JSON.stringify({ selected: visualMapAfterBatch?.selected, count: visualMapChangeCount - visualMapBatchStart }))
+				visualMapInteraction.updateOptions({ visualMap: { ...visualMapInteractionConfig, selected: [0] } })
+				await settle(60)
+				const visualMapControlled = visualMapInteraction.getVisualMap()
+				check('visualMap：受控 selected 更新会重绘且不回声 onChange', visualMapControlled.selected.join(',') === '0' && visualMapRow(0).getAttribute('aria-pressed') === 'true' && visualMapRow(1).getAttribute('aria-pressed') === 'false' && visualMapChangeCount === visualMapBatchStart + 1, JSON.stringify({ selected: visualMapControlled?.selected, count: visualMapChangeCount }))
+				visualMapInteraction.updateOptions({ visualMap: { ...visualMapInteractionConfig, selectedMode: 'single', selected: [0] } })
+				await settle(60)
+				visualMapRow(1).dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				await settle(40)
+				const visualMapSingle = visualMapInteraction.getVisualMap()
+				const visualMapSingleCount = visualMapChangeCount
+				visualMapRow(1).dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				await settle(40)
+				const visualMapSingleCleared = visualMapInteraction.getVisualMap()
+				check('visualMap：selectedMode single 只保留一段，再点可清空', visualMapSingle.selected.join(',') === '1' && visualMapSingleCleared.selected.length === 0 && visualMapChangeCount === visualMapSingleCount + 1, JSON.stringify({ single: visualMapSingle?.selected, cleared: visualMapSingleCleared?.selected }))
+				visualMapInteraction.destroy()
+				visualMapInteractionHost.remove()
+
+				/* visualMap：连续尺区间手柄 / 拖动 / 受控 range */
+				const visualMapRangeHost = document.createElement('div')
+				visualMapRangeHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapRangeHost)
+				let visualMapRangeChanges = 0
+				const visualMapRangePayloads = []
+				const visualMapRangeConfig = {
+					target: 'point',
+					type: 'ruler',
+					interactive: true,
+					orient: 'horizontal',
+					title: '区间过滤',
+					unit: 'kW',
+					onChange: (payload) => {
+						visualMapRangeChanges += 1
+						visualMapRangePayloads.push(payload)
+					}
+				}
+				const visualMapRangeView = createGisView(visualMapRangeHost, {
+					points: [{ id: 'vmr-a', x: 0, y: 0, value: 0 }, { id: 'vmr-b', x: 40, y: 0, value: 50 }, { id: 'vmr-c', x: 80, y: 0, value: 100 }],
+					visualMap: visualMapRangeConfig,
+					showGrid: false
+				})
+				await settle(80)
+				const visualMapRangeElement = visualMapRangeView.getVisualMapElement()
+				const visualMapRangeTrack = visualMapRangeElement.querySelector('.gis-view__visual-map-ruler')
+				const visualMapRangeHandles = [...visualMapRangeElement.querySelectorAll('.gis-view__visual-map-range-handle')]
+				const visualMapRangeInitial = visualMapRangeView.getVisualMap()
+				check('visualMap：interactive 连续尺默认 calculable 并显示两端手柄', visualMapRangeInitial.calculable === true && visualMapRangeInitial.range[0] === 0 && visualMapRangeInitial.range[1] === 100 && visualMapRangeInitial.rangeRatios.join(',') === '0,1' && visualMapRangeHandles.length === 2 && visualMapRangeHandles.every(handle => handle.getAttribute('role') === 'slider'), JSON.stringify({ range: visualMapRangeInitial?.range, ratios: visualMapRangeInitial?.rangeRatios }))
+				visualMapRangeHandles[1].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft', bubbles: true, cancelable: true }))
+				await settle(40)
+				const visualMapRangeKeyboard = visualMapRangeView.getVisualMap()
+				check('visualMap：区间手柄支持键盘步进并触发 range 回调', Math.abs(visualMapRangeKeyboard.range[0]) < 1e-6 && Math.abs(visualMapRangeKeyboard.range[1] - 98) < 1e-6 && visualMapRangeChanges === 1 && visualMapRangePayloads[0].reason === 'range', JSON.stringify({ range: visualMapRangeKeyboard?.range, count: visualMapRangeChanges }))
+				const visualMapRangeRect = visualMapRangeTrack.getBoundingClientRect()
+				const visualMapPointer = (type, ratio, buttons) => visualMapRangeHandles[1].dispatchEvent(new PointerEvent(type, {
+					bubbles: true,
+					cancelable: true,
+					pointerId: 71,
+					pointerType: 'mouse',
+					button: 0,
+					buttons,
+					clientX: visualMapRangeRect.left + visualMapRangeRect.width * ratio,
+					clientY: visualMapRangeRect.top + visualMapRangeRect.height / 2
+				}))
+				const visualMapDragStart = visualMapRangeChanges
+				visualMapPointer('pointerdown', 0.98, 1)
+				visualMapPointer('pointermove', 0.8, 1)
+				visualMapPointer('pointermove', 0.65, 1)
+				visualMapPointer('pointermove', 0.5, 1)
+				visualMapPointer('pointerup', 0.5, 0)
+				await settle(50)
+				const visualMapRangeDragged = visualMapRangeView.getVisualMap()
+				check('visualMap：拖动区间手柄更新 range，连续事件只回调一次', Math.abs(visualMapRangeDragged.range[0]) < 1e-6 && Math.abs(visualMapRangeDragged.range[1] - 50) < 1e-6 && visualMapRangeChanges === visualMapDragStart + 1, JSON.stringify({ range: visualMapRangeDragged?.range, callbacks: visualMapRangeChanges - visualMapDragStart }))
+				visualMapRangeView.updateOptions({ visualMap: { ...visualMapRangeConfig, range: [25, 75] } })
+				await settle(60)
+				const visualMapRangeControlled = visualMapRangeView.getVisualMap()
+				const visualMapRangeWindow = visualMapRangeElement.querySelector('.gis-view__visual-map-range')
+				check('visualMap：受控 range 更新手柄位置且不回声 onChange', visualMapRangeControlled.range.join(',') === '25,75' && Math.abs(visualMapRangeControlled.rangeRatios[0] - 0.25) < 1e-6 && Math.abs(visualMapRangeControlled.rangeRatios[1] - 0.75) < 1e-6 && visualMapRangeWindow.style.left === '25%' && visualMapRangeWindow.style.width === '50%' && visualMapRangeChanges === visualMapDragStart + 1, JSON.stringify({ range: visualMapRangeControlled?.range, ratios: visualMapRangeControlled?.rangeRatios, style: [visualMapRangeWindow.style.left, visualMapRangeWindow.style.width] }))
+				const visualMapRangeCopy = visualMapRangeView.getVisualMap()
+				visualMapRangeCopy.range[0] = -999
+				visualMapRangeCopy.rangeRatios[1] = 9
+				const visualMapRangeFresh = visualMapRangeView.getVisualMap()
+				check('visualMap：读数里的 range / rangeRatios 是独立副本', visualMapRangeFresh.range[0] === 25 && visualMapRangeFresh.rangeRatios[1] === 0.75, JSON.stringify({ range: visualMapRangeFresh.range, ratios: visualMapRangeFresh.rangeRatios }))
+				visualMapRangeView.destroy()
+				visualMapRangeHost.remove()
+
+				/* visualMap：选区真正进入热力上色（分段 / 连续区间都门控，而不只是回显读数） */
+				const visualMapGateHost = document.createElement('div')
+				visualMapGateHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapGateHost)
+				const visualMapGateHeatmap = {
+					enabled: true,
+					target: 'point',
+					field: 'value',
+					domain: [0, 20],
+					colors: ['#ff0000', '#ff0000'],
+					opacity: 1,
+					density: false,
+					glow: false
+				}
+				const visualMapGateConfig = {
+					target: 'point',
+					type: 'piecewise',
+					interactive: true,
+					selectedMode: 'multiple',
+					pieces: [{ lt: 5 }, { gte: 5, lt: 15 }, { gte: 15 }]
+				}
+				const visualMapGateView = createGisView(visualMapGateHost, {
+					points: [{ id: 'vmg-a', x: 0, y: 0, value: 1 }, { id: 'vmg-b', x: 40, y: 0, value: 10 }, { id: 'vmg-c', x: 80, y: 0, value: 20 }],
+					pointStyle: { color: '#ffffff', size: 12 },
+					heatmap: visualMapGateHeatmap,
+					visualMap: visualMapGateConfig,
+					minimap: { width: 180, height: 120 },
+					showGrid: false
+				})
+				await settle(100)
+				const visualMapGateFills = () => visualMapGateView.snapshotScene().points.map(point => point.fill)
+				const visualMapGateMiniCanvas = visualMapGateView.getMinimapElement()?.querySelector('.gis-view__minimap-canvas')
+				const visualMapGateMiniRed = () => {
+					const context = visualMapGateMiniCanvas?.getContext('2d')
+					if (!context) {
+						return -1
+					}
+					const data = context.getImageData(0, 0, visualMapGateMiniCanvas.width, visualMapGateMiniCanvas.height).data
+					let count = 0
+					for (let index = 0; index < data.length; index += 4) {
+						if (data[index] > 180 && data[index + 1] < 100 && data[index + 2] < 100) {
+							count += 1
+						}
+					}
+					return count
+				}
+				const visualMapGateInitial = visualMapGateFills()
+				const visualMapGateMiniInitial = visualMapGateMiniRed()
+				visualMapGateView.getVisualMapElement().querySelector('.gis-view__visual-map-piece[data-index="0"]').dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				await settle(80)
+				const visualMapGatePiecewise = visualMapGateFills()
+				visualMapGateView.updateOptions({ visualMap: { ...visualMapGateConfig, selected: [2] } })
+				await settle(80)
+				const visualMapGateControlled = visualMapGateFills()
+				const visualMapGateMiniControlled = visualMapGateMiniRed()
+				check('visualMap：取消分段后对应值退出热力上色，再选一段只保留该档',
+					visualMapGateInitial.every(fill => fill === 'rgba(255,0,0,1)') &&
+						visualMapGatePiecewise[0] === 'rgba(255,255,255,1)' && visualMapGatePiecewise[1] === 'rgba(255,0,0,1)' && visualMapGatePiecewise[2] === 'rgba(255,0,0,1)' &&
+						visualMapGateControlled[0] === 'rgba(255,255,255,1)' && visualMapGateControlled[1] === 'rgba(255,255,255,1)' && visualMapGateControlled[2] === 'rgba(255,0,0,1)',
+					JSON.stringify({ initial: visualMapGateInitial, piecewise: visualMapGatePiecewise, controlled: visualMapGateControlled }))
+				check('visualMap：鹰眼图继承主图热力时也按同一选区门控',
+					visualMapGateMiniInitial > 0 && visualMapGateMiniControlled > 0 && visualMapGateMiniControlled < visualMapGateMiniInitial * 0.8,
+					`初始红色 ${visualMapGateMiniInitial} px · 选中高段后 ${visualMapGateMiniControlled} px`)
+				const visualMapGateMiniGreen = () => {
+					const context = visualMapGateMiniCanvas?.getContext('2d')
+					if (!context) {
+						return -1
+					}
+					const data = context.getImageData(0, 0, visualMapGateMiniCanvas.width, visualMapGateMiniCanvas.height).data
+					let count = 0
+					for (let index = 0; index < data.length; index += 4) {
+						if (data[index] < 100 && data[index + 1] > 180 && data[index + 2] < 100) {
+							count += 1
+						}
+					}
+					return count
+				}
+				visualMapGateView.updateOptions({ minimap: { width: 180, height: 120, heatmap: { target: 'point', field: 'value', domain: [0, 20], colors: ['#00ff00', '#00ff00'], opacity: 1, density: false, glow: false } } })
+				await settle(100)
+				const visualMapGateMiniIndependent = visualMapGateMiniGreen()
+				visualMapGateView.updateOptions({ visualMap: { ...visualMapGateConfig, selected: [0] } })
+				await settle(100)
+				const visualMapGateMiniIndependentAfter = visualMapGateMiniGreen()
+				check('visualMap：显式 minimap.heatmap 仍按自己的配置取色，不被主图选区门控',
+					visualMapGateMiniIndependent > 0 && visualMapGateMiniIndependentAfter === visualMapGateMiniIndependent,
+					`绿色 ${visualMapGateMiniIndependent} px → ${visualMapGateMiniIndependentAfter} px`)
+				visualMapGateView.destroy()
+				visualMapGateHost.remove()
+
+				const visualMapDensityGateHost = document.createElement('div')
+				visualMapDensityGateHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapDensityGateHost)
+				const visualMapDensityGateConfig = { target: 'point', type: 'piecewise', interactive: true, selectedMode: 'multiple', pieces: [{ lt: 5 }, { gte: 5, lt: 15 }, { gte: 15 }], selected: [2] }
+				const visualMapDensityGateView = createGisView(visualMapDensityGateHost, {
+					points: [{ id: 'vmdg-a', x: 0, y: 0, value: 1 }, { id: 'vmdg-b', x: 40, y: 0, value: 10 }, { id: 'vmdg-c', x: 80, y: 0, value: 20 }],
+					heatmap: { ...visualMapGateHeatmap, density: { resolution: 96, radiusRatio: 0.12, threshold: 0 } },
+					visualMap: visualMapDensityGateConfig,
+					showGrid: false
+				})
+				await settle(140)
+				const visualMapDensityGated = visualMapDensityGateView.getStats().heatDensity
+				visualMapDensityGateView.updateOptions({ visualMap: { ...visualMapDensityGateConfig, selected: [0, 1, 2] } })
+				await settle(140)
+				const visualMapDensityExpanded = visualMapDensityGateView.getStats().heatDensity
+				check('visualMap：密度场也按选区重新采样，落选值不再贡献密度',
+					visualMapDensityGated?.samples === 1 && visualMapDensityExpanded?.samples === 3,
+					JSON.stringify({ gated: visualMapDensityGated, expanded: visualMapDensityExpanded }))
+				visualMapDensityGateView.destroy()
+				visualMapDensityGateHost.remove()
+
+				const visualMapRangeGateHost = document.createElement('div')
+				visualMapRangeGateHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapRangeGateHost)
+				const visualMapRangeGateConfig = { target: 'point', type: 'ruler', interactive: true, range: [25, 75] }
+				const visualMapRangeGateView = createGisView(visualMapRangeGateHost, {
+					points: [{ id: 'vmrg-a', x: 0, y: 0, value: 0 }, { id: 'vmrg-b', x: 40, y: 0, value: 50 }, { id: 'vmrg-c', x: 80, y: 0, value: 100 }],
+					pointStyle: { color: '#ffffff', size: 12 },
+					heatmap: { ...visualMapGateHeatmap, domain: [0, 100] },
+					visualMap: visualMapRangeGateConfig,
+					showGrid: false
+				})
+				await settle(100)
+				const visualMapRangeGateFills = () => visualMapRangeGateView.snapshotScene().points.map(point => point.fill)
+				const visualMapRangeGateInitial = visualMapRangeGateFills()
+				visualMapRangeGateView.updateOptions({ visualMap: { ...visualMapRangeGateConfig, range: [0, 100] } })
+				await settle(80)
+				const visualMapRangeGateExpanded = visualMapRangeGateFills()
+				check('visualMap：连续尺区间外不参与热力上色，拖动扩回整段后全部恢复',
+					visualMapRangeGateInitial[0] === 'rgba(255,255,255,1)' && visualMapRangeGateInitial[1] === 'rgba(255,0,0,1)' && visualMapRangeGateInitial[2] === 'rgba(255,255,255,1)' &&
+						visualMapRangeGateExpanded.every(fill => fill === 'rgba(255,0,0,1)'),
+					JSON.stringify({ initial: visualMapRangeGateInitial, expanded: visualMapRangeGateExpanded }))
+				visualMapRangeGateView.destroy()
+				visualMapRangeGateHost.remove()
+
+				/* visualMap：render(context) 完全自定义 + 上下文交互 */
+				const visualMapCustomHost = document.createElement('div')
+				visualMapCustomHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapCustomHost)
+				let visualMapCustomCalls = 0
+				let visualMapCustomContext = null
+				let visualMapCustomChanges = 0
+				const visualMapCustomRender = (context) => {
+					visualMapCustomCalls += 1
+					visualMapCustomContext = context
+					const wrapper = document.createElement('div')
+					wrapper.className = 'vm-custom-content'
+					const readout = document.createElement('span')
+					readout.className = 'vm-custom-readout'
+					readout.textContent = `${context.title}：${context.selected.join('/')}`
+					const button = document.createElement('button')
+					button.type = 'button'
+					button.className = 'vm-custom-select-high'
+					button.textContent = '只选高档'
+					button.addEventListener('click', () => context.setSelection([2]))
+					wrapper.append(readout, button)
+					return wrapper
+				}
+				const visualMapCustomConfig = {
+					target: 'point',
+					type: 'piecewise',
+					interactive: true,
+					selectedMode: 'multiple',
+					title: '自定义图例',
+					pieces: [{ lt: 5, label: '低' }, { gte: 5, lt: 15, label: '中' }, { gte: 15, label: '高' }],
+					render: visualMapCustomRender,
+					onChange: () => { visualMapCustomChanges += 1 }
+				}
+				const visualMapCustomView = createGisView(visualMapCustomHost, {
+					points: [{ id: 'vmc-a', x: 0, y: 0, value: 1 }, { id: 'vmc-b', x: 40, y: 0, value: 10 }, { id: 'vmc-c', x: 80, y: 0, value: 20 }],
+					visualMap: visualMapCustomConfig,
+					showGrid: false
+				})
+				await settle(80)
+				const visualMapCustomElement = visualMapCustomView.getVisualMapElement()
+				const visualMapCustomInitial = visualMapCustomView.getVisualMap()
+				check('visualMap：自定义 render 返回 DOM、隐藏内置标题并提供上下文读数', visualMapCustomCalls === 1 && visualMapCustomElement.querySelector('.vm-custom-content') !== null && visualMapCustomElement.querySelector('.gis-view__visual-map-title').hidden === true && visualMapCustomContext.domain.join(',') === '1,20' && visualMapCustomContext.selected.join(',') === '0,1,2' && visualMapCustomInitial.selected.length === 3, JSON.stringify({ calls: visualMapCustomCalls, hidden: visualMapCustomElement.querySelector('.gis-view__visual-map-title')?.hidden, context: visualMapCustomContext && { domain: visualMapCustomContext.domain, selected: visualMapCustomContext.selected } }))
+				visualMapCustomElement.querySelector('.vm-custom-select-high').dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				await settle(50)
+				const visualMapCustomSelected = visualMapCustomView.getVisualMap()
+				check('visualMap：自定义上下文 setSelection 更新读数并回调 api 来源', visualMapCustomSelected.selected.join(',') === '2' && visualMapCustomChanges === 1 && visualMapCustomCalls === 1, JSON.stringify({ selected: visualMapCustomSelected?.selected, changes: visualMapCustomChanges, calls: visualMapCustomCalls }))
+				visualMapCustomView.updateOptions({ visualMap: { ...visualMapCustomConfig, title: '自定义图例 2' } })
+				await settle(60)
+				check('visualMap：自定义 render 的配置签名变化会重绘，并保留用户选区', visualMapCustomCalls === 2 && visualMapCustomElement.querySelector('.vm-custom-readout')?.textContent === '自定义图例 2：2', JSON.stringify({ calls: visualMapCustomCalls, text: visualMapCustomElement.querySelector('.vm-custom-readout')?.textContent }))
+				visualMapCustomView.updateOptions({ visualMap: { ...visualMapCustomConfig, title: '字符串图例', render: context => `<strong class="vm-custom-string">${context.domain[0]} ~ ${context.domain[1]}</strong>` } })
+				await settle(60)
+				check('visualMap：自定义 render 也可返回 HTML 字符串', visualMapCustomElement.querySelector('.vm-custom-string')?.textContent === '1 ~ 20', visualMapCustomElement.innerHTML)
+				visualMapCustomView.destroy()
+				visualMapCustomHost.remove()
+
+				/* visualMap：outOfRange 三种落选策略；network 只做视觉门控，不改数据 / 筛选 / 通道声明 */
+				const visualMapOutOfRangeHost = document.createElement('div')
+				visualMapOutOfRangeHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapOutOfRangeHost)
+				const visualMapOutOfRangeChanges = []
+				const visualMapOutOfRangeHeatmap = {
+					enabled: true,
+					target: 'point',
+					field: 'value',
+					domain: [0, 20],
+					colors: ['#ff0000', '#ff0000'],
+					opacity: 1,
+					density: false,
+					glow: false
+				}
+				const visualMapOutOfRangeConfig = {
+					target: 'point',
+					field: 'value',
+					type: 'piecewise',
+					interactive: true,
+					selectedMode: 'multiple',
+					pieces: [{ lt: 5 }, { gte: 5, lt: 15 }, { gte: 15 }],
+					selected: [1],
+					onChange: payload => visualMapOutOfRangeChanges.push(payload)
+				}
+				const visualMapOutOfRangeView = createGisView(visualMapOutOfRangeHost, {
+					points: [
+						{ id: 'vmor-a', x: -60, y: 0, value: 1 },
+						{ id: 'vmor-b', x: 0, y: 0, value: 10 },
+						{ id: 'vmor-c', x: 60, y: 0, value: 20 }
+					],
+					pointStyle: { color: '#ffffff', size: 14 },
+					heatmap: visualMapOutOfRangeHeatmap,
+					visualMap: visualMapOutOfRangeConfig,
+					minimap: {
+						width: 180,
+						height: 120,
+						heatmap: {
+							target: 'point',
+							field: 'value',
+							domain: [0, 20],
+							colors: ['#00ff00', '#00ff00'],
+							opacity: 1,
+							density: false,
+							glow: false
+						}
+					},
+					showGrid: false
+				})
+				await settle()
+				const visualMapOutOfRangeScenePoints = () => {
+					const scene = visualMapOutOfRangeView.snapshotScene()
+					return [...scene.points, ...scene.raised]
+				}
+				const visualMapOutOfRangeCanvas = visualMapOutOfRangeView.getMinimapElement()?.querySelector('.gis-view__minimap-canvas')
+				const visualMapOutOfRangeMiniGreen = () => {
+					const context = visualMapOutOfRangeCanvas?.getContext('2d')
+					if (!context) {
+						return -1
+					}
+					const data = context.getImageData(0, 0, visualMapOutOfRangeCanvas.width, visualMapOutOfRangeCanvas.height).data
+					let count = 0
+					for (let index = 0; index < data.length; index += 4) {
+						if (data[index] < 100 && data[index + 1] > 180 && data[index + 2] < 100) {
+							count += 1
+						}
+					}
+					return count
+				}
+				const visualMapOutOfRangeInitialFills = visualMapOutOfRangeScenePoints().map(point => point.fill)
+				const visualMapOutOfRangeMiniInitial = visualMapOutOfRangeMiniGreen()
+				check('visualMap：outOfRange 缺省 heatmap，只退热力，落选节点仍在画布上',
+					visualMapOutOfRangeView.getVisualMap()?.outOfRange === 'heatmap' &&
+						visualMapOutOfRangeInitialFills.length === 3 && visualMapOutOfRangeInitialFills[0] === 'rgba(255,255,255,1)' && visualMapOutOfRangeInitialFills[1] === 'rgba(255,0,0,1)' && visualMapOutOfRangeInitialFills[2] === 'rgba(255,255,255,1)',
+					JSON.stringify({ mode: visualMapOutOfRangeView.getVisualMap()?.outOfRange, fills: visualMapOutOfRangeInitialFills }))
+				visualMapOutOfRangeView.selectFeatures('vmor-a')
+				const visualMapOutOfRangeFilterBefore = visualMapOutOfRangeView.getFilterResult()
+				visualMapOutOfRangeView.updateOptions({ visualMap: { ...visualMapOutOfRangeConfig, outOfRange: 'network' } })
+				await settle()
+				const visualMapOutOfRangeHiddenIds = visualMapOutOfRangeView.listPoints().map(point => point.item.id)
+				const visualMapOutOfRangeMiniHidden = visualMapOutOfRangeMiniGreen()
+				check('visualMap：network 让落选点退出画布与可见列表，数据 / 筛选 / 选中集原样保留',
+					visualMapOutOfRangeHiddenIds.join(',') === 'vmor-b' &&
+						visualMapOutOfRangeScenePoints().length === 1 &&
+						visualMapOutOfRangeView.getData().points.length === 3 &&
+						visualMapOutOfRangeView.getVisibleData().points.length === 3 &&
+						visualMapOutOfRangeView.getFilterResult() === visualMapOutOfRangeFilterBefore &&
+						visualMapOutOfRangeView.getSelectionData().ids.join(',') === 'vmor-a',
+					JSON.stringify({ visible: visualMapOutOfRangeHiddenIds, data: visualMapOutOfRangeView.getData().points.length, selection: visualMapOutOfRangeView.getSelectionData().ids }))
+				check('visualMap：network 的隐藏集合同步到使用独立热力配置的鹰眼图',
+					visualMapOutOfRangeMiniInitial > 0 && visualMapOutOfRangeMiniHidden > 0 && visualMapOutOfRangeMiniHidden < visualMapOutOfRangeMiniInitial * 0.75,
+					`初始绿色 ${visualMapOutOfRangeMiniInitial} px · 隐藏后 ${visualMapOutOfRangeMiniHidden} px`)
+				visualMapOutOfRangeView.updateOptions({ visualMap: { ...visualMapOutOfRangeConfig, outOfRange: 'network', selected: [0, 1, 2] } })
+				await settleMs(300)
+				const visualMapOutOfRangeMiniRestored = visualMapOutOfRangeMiniGreen()
+				check('visualMap：network 恢复全选后落选点回到画布，原选中集仍在',
+					visualMapOutOfRangeView.listPoints().length === 3 && visualMapOutOfRangeScenePoints().length === 3 &&
+						visualMapOutOfRangeView.getSelectionData().ids.join(',') === 'vmor-a' && visualMapOutOfRangeMiniRestored >= visualMapOutOfRangeMiniInitial * 0.8,
+					JSON.stringify({ visible: visualMapOutOfRangeView.listPoints().map(point => point.item.id), selection: visualMapOutOfRangeView.getSelectionData().ids, mini: [visualMapOutOfRangeMiniInitial, visualMapOutOfRangeMiniHidden, visualMapOutOfRangeMiniRestored] }))
+				visualMapOutOfRangeView.updateOptions({ visualMap: { ...visualMapOutOfRangeConfig, outOfRange: 'none', selected: [0, 1, 2] } })
+				await settle()
+				const visualMapOutOfRangeNoneChanges = visualMapOutOfRangeChanges.length
+				visualMapOutOfRangeView.getVisualMapElement().querySelectorAll('.gis-view__visual-map-piece')[1].dispatchEvent(new MouseEvent('click', { bubbles: true, cancelable: true }))
+				await settle()
+				const visualMapOutOfRangeNoneFills = visualMapOutOfRangeScenePoints().map(point => point.fill)
+				check('visualMap：outOfRange none 不做事先门控，选区变化只通过 onChange 交给业务',
+					visualMapOutOfRangeNoneFills.length === 3 && visualMapOutOfRangeNoneFills.every(fill => fill === 'rgba(255,0,0,1)') &&
+						visualMapOutOfRangeView.getVisualMap().selected.join(',') === '0,2' &&
+						visualMapOutOfRangeChanges.length === visualMapOutOfRangeNoneChanges + 1 && visualMapOutOfRangeChanges.at(-1)?.outOfRange === 'none',
+					JSON.stringify({ fills: visualMapOutOfRangeNoneFills, selected: visualMapOutOfRangeView.getVisualMap().selected, changes: visualMapOutOfRangeChanges.length - visualMapOutOfRangeNoneChanges }))
+				visualMapOutOfRangeView.destroy()
+				visualMapOutOfRangeHost.remove()
+
+				const visualMapLineOutOfRangeHost = document.createElement('div')
+				visualMapLineOutOfRangeHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapLineOutOfRangeHost)
+				const visualMapLineOutOfRangeConfig = {
+					target: 'line',
+					field: 'value',
+					type: 'piecewise',
+					interactive: true,
+					selectedMode: 'multiple',
+					pieces: [{ lt: 5 }, { gte: 5, lt: 15 }, { gte: 15 }],
+					selected: [0, 1],
+					outOfRange: 'network'
+				}
+				const visualMapLineOutOfRangeView = createGisView(visualMapLineOutOfRangeHost, {
+					points: [
+						{ id: 'vml-a', x: 0, y: 0, size: 12 },
+						{ id: 'vml-b', x: 180, y: 60, size: 12 }
+					],
+					lines: [
+						{ id: 'vml-solo-low', path: [[0, 130], [180, 130]], value: 1, width: 6 },
+						{ id: 'vml-solo-high', path: [[0, 160], [180, 160]], value: 10, width: 6 },
+						{ id: 'vml-ch-low', path: [[0, 0], [90, 30], [180, 60]], value: 1, width: 6 },
+						{ id: 'vml-ch-high', path: [[0, 10], [90, 40], [180, 70]], value: 10, width: 6 }
+					],
+					channels: [
+						{ id: 'vml-ch-low', from: 'vml-a', to: 'vml-b', lineIds: ['vml-ch-low'], value: 1 },
+						{ id: 'vml-ch-high', from: 'vml-a', to: 'vml-b', lineIds: ['vml-ch-high'], value: 10 }
+					],
+					visualMap: visualMapLineOutOfRangeConfig,
+					showGrid: false
+				})
+				await settle()
+				const visualMapLineSceneCount = () => {
+					const scene = visualMapLineOutOfRangeView.snapshotScene()
+					return scene.lines.length + scene.raisedLines.length
+				}
+				const visualMapLineChannelsBefore = JSON.stringify(visualMapLineOutOfRangeView.getChannels())
+				const visualMapLineChannelLowBefore = JSON.stringify(visualMapLineOutOfRangeView.getChannel('vml-ch-low'))
+				const visualMapLineFilterBefore = visualMapLineOutOfRangeView.getFilterResult()
+				visualMapLineOutOfRangeView.selectFeatures('vml-solo-low')
+				visualMapLineOutOfRangeView.updateOptions({ visualMap: { ...visualMapLineOutOfRangeConfig, selected: [1] } })
+				await settle()
+				const visualMapLineHiddenIds = visualMapLineOutOfRangeView.listLines().map(line => line.item.id)
+				check('visualMap：network + line 只隐藏落选独立线路，不误伤同值的通道回线',
+					!visualMapLineHiddenIds.includes('vml-solo-low') && visualMapLineHiddenIds.includes('vml-solo-high') &&
+						visualMapLineHiddenIds.includes('vml-ch-low') && visualMapLineHiddenIds.includes('vml-ch-high') &&
+						visualMapLineSceneCount() === 3 && visualMapLineOutOfRangeView.getData().lines.length === 4 &&
+						visualMapLineOutOfRangeView.getFilterResult() === visualMapLineFilterBefore && visualMapLineOutOfRangeView.getSelectionData().ids.join(',') === 'vml-solo-low',
+					JSON.stringify({ visible: visualMapLineHiddenIds, data: visualMapLineOutOfRangeView.getData().lines.length, selection: visualMapLineOutOfRangeView.getSelectionData().ids }))
+				visualMapLineOutOfRangeView.updateOptions({ visualMap: { ...visualMapLineOutOfRangeConfig, target: 'channel', selected: [1] } })
+				await settle()
+				const visualMapChannelHiddenIds = visualMapLineOutOfRangeView.listLines().map(line => line.item.id)
+				check('visualMap：network + channel 按声明隐藏整条落选通道，通道声明与数据不变',
+					visualMapChannelHiddenIds.includes('vml-solo-low') && visualMapChannelHiddenIds.includes('vml-solo-high') &&
+						!visualMapChannelHiddenIds.includes('vml-ch-low') && visualMapChannelHiddenIds.includes('vml-ch-high') &&
+						visualMapLineSceneCount() === 3 &&
+						JSON.stringify(visualMapLineOutOfRangeView.getChannels()) === visualMapLineChannelsBefore &&
+						JSON.stringify(visualMapLineOutOfRangeView.getChannel('vml-ch-low')) === visualMapLineChannelLowBefore,
+					JSON.stringify({ visible: visualMapChannelHiddenIds, channels: visualMapLineOutOfRangeView.getChannels().map(channel => channel.channelId) }))
+				visualMapLineOutOfRangeView.updateOptions({ visualMap: { ...visualMapLineOutOfRangeConfig, target: 'channel', selected: [0, 1] } })
+				await settle()
+				check('visualMap：channel 恢复全选后所有通道回线回到画布',
+					visualMapLineOutOfRangeView.listLines().length === 4 && visualMapLineSceneCount() === 4,
+					JSON.stringify({ visible: visualMapLineOutOfRangeView.listLines().map(line => line.item.id) }))
+				visualMapLineOutOfRangeView.destroy()
+				visualMapLineOutOfRangeHost.remove()
+
+				const visualMapMultiTargetHost = document.createElement('div')
+				visualMapMultiTargetHost.style.cssText = 'width:520px;height:300px'
+				document.body.append(visualMapMultiTargetHost)
+				const visualMapMultiTargetConfig = {
+					field: 'value',
+					type: 'piecewise',
+					interactive: true,
+					selectedMode: 'multiple',
+					pieces: [{ lt: 5 }, { gte: 5 }],
+					selected: [1],
+					outOfRange: 'network'
+				}
+				const visualMapMultiTargetView = createGisView(visualMapMultiTargetHost, {
+					points: [
+						{ id: 'vmmt-low', x: 0, y: 0, size: 12 },
+						{ id: 'vmmt-high', x: 180, y: 60, size: 12 }
+					],
+					lines: [
+						{ id: 'vmmt-solo-low', path: [[0, 130], [180, 130]], value: 1, width: 6 },
+						{ id: 'vmmt-solo-high', path: [[0, 160], [180, 160]], value: 10, width: 6 },
+						{ id: 'vmmt-ch-low', path: [[0, 0], [90, 30], [180, 60]], value: 1, width: 6 },
+						{ id: 'vmmt-ch-high', path: [[0, 10], [90, 40], [180, 70]], value: 10, width: 6 }
+					],
+					channels: [
+						{ id: 'vmmt-ch-low', from: 'vmmt-low', to: 'vmmt-high', lineIds: ['vmmt-ch-low'], value: 1 },
+						{ id: 'vmmt-ch-high', from: 'vmmt-low', to: 'vmmt-high', lineIds: ['vmmt-ch-high'], value: 10 }
+					],
+					heatmap: { target: ['point', 'line', 'channel'], field: 'value', density: false, glow: false, opacity: 1 },
+					visualMap: visualMapMultiTargetConfig,
+					showGrid: false
+				})
+				await settle()
+				const visualMapMultiTargetInitial = visualMapMultiTargetView.getVisualMap()
+				const visualMapMultiTargetInitialLines = visualMapMultiTargetView.listLines().map(line => line.item.id)
+				check('visualMap：不写 target 时跳过缺字段的节点选展示值域，门控仍覆盖全部热力目标',
+					visualMapMultiTargetInitial?.target === 'line' && visualMapMultiTargetInitial.domain.join(',') === '1,10' &&
+						visualMapMultiTargetView.listPoints().length === 2 &&
+						visualMapMultiTargetInitialLines.join(',') === 'vmmt-solo-high,vmmt-ch-high',
+					JSON.stringify({ readout: visualMapMultiTargetInitial && { target: visualMapMultiTargetInitial.target, domain: visualMapMultiTargetInitial.domain }, points: visualMapMultiTargetView.listPoints().map(point => point.item.id), lines: visualMapMultiTargetInitialLines }))
+				visualMapMultiTargetView.updatePoint('vmmt-low', { value: 1 })
+				visualMapMultiTargetView.updatePoint('vmmt-high', { value: 10 })
+				await settle()
+				const visualMapMultiTargetPoints = visualMapMultiTargetView.listPoints().map(point => point.item.id)
+				const visualMapMultiTargetLines = visualMapMultiTargetView.listLines().map(line => line.item.id)
+				check('visualMap：多目标 network 同时隐藏落选节点、独立线路与整条落选通道',
+					visualMapMultiTargetView.getVisualMap()?.target === 'point' &&
+						visualMapMultiTargetPoints.join(',') === 'vmmt-high' &&
+						visualMapMultiTargetLines.join(',') === 'vmmt-solo-high,vmmt-ch-high' &&
+						visualMapMultiTargetView.getData().points.length === 2 && visualMapMultiTargetView.getData().lines.length === 4 &&
+						visualMapMultiTargetView.getChannels().length === 2,
+					JSON.stringify({ target: visualMapMultiTargetView.getVisualMap()?.target, points: visualMapMultiTargetPoints, lines: visualMapMultiTargetLines }))
+				visualMapMultiTargetView.updateOptions({ visualMap: { ...visualMapMultiTargetConfig, selected: [0, 1] } })
+				await settle()
+				check('visualMap：多目标恢复全选后节点、独立线路与通道成员全部回到画布',
+					visualMapMultiTargetView.listPoints().length === 2 && visualMapMultiTargetView.listLines().length === 4,
+					JSON.stringify({ points: visualMapMultiTargetView.listPoints().map(point => point.item.id), lines: visualMapMultiTargetView.listLines().map(line => line.item.id) }))
+				visualMapMultiTargetView.destroy()
+				visualMapMultiTargetHost.remove()
+
 				lineOnlyView.destroy()
 				lineOnlyHost.remove()
 				splitView.destroy()