gis-view-webgl2 0.1.0 → 0.1.2

package/docs/demos/GisViewDemo.vue

@@ -717,7 +717,7 @@ const handleQualityChange = (state) => {
 }
 /**
  * 动画效果（effects）：线路上的跑动图标（ECharts 的 lines.effect 那一类）与节点上的扩散涟漪（effectScatter 那一类）。
- * 两种写法：全局缺省（setEffects / options.effects）与逐要素（数据里的 points[].effect / lines[].effect）。
+ * 两种写法：全局缺省（updateOptions({ effects }) / options.effects）与逐要素（数据里的 points[].effect / lines[].effect）。
  * 三种「关」是四件事：全局一个都不配（只有逐条配的动）/ effects: false 一处全关（连逐条配的也关掉）/
  * effects.line: false 只关全局那一份 / 逐条 effect: false 只关这一条。
  * 读数抄的是 getEffects()（归一化之后的配置，enabled 是「这次要不要动」的运行时口径）与 getStats()
@@ -790,14 +790,14 @@ const applyEffects = () => {
 	if (!view) {
 		return
 	}
-	view.setEffects({
+	view.updateOptions({ effects: {
 		line: effectLineOn.value ? buildEffectLine() : null,
 		point: effectPointOn.value ? buildEffectPoint() : null
-	})
+	} })
 	syncEffectsReadout()
 	// 这一帧的读数要等引擎画完才准（动点 / 涟漪数是上一帧统计出来的）：下一帧再抄一遍
 	requestAnimationFrame(() => syncEffectsReadout())
-	lastEvent.value = `setEffects：线路 ${effectLineOn.value ? '开' : '关'} / 节点 ${effectPointOn.value ? '开' : '关'} —— 与 options.effects 是同一份配置，区别只是这份在运行时换`
+	lastEvent.value = `updateOptions({ effects })：线路 ${effectLineOn.value ? '开' : '关'} / 节点 ${effectPointOn.value ? '开' : '关'} —— 与 options.effects 是同一份配置，区别只是这份在运行时换`
 }
 /** 逐条覆盖：前几条要素把 effect 写进数据（数据副本带 effect，导出不受影响），其余照旧走全局那一份 */
 const PER_ITEM_EFFECT_COUNT = 3
@@ -1135,7 +1135,7 @@ const PANEL_ITEMS = [
 	{ id: 'view-export', tab: 'view', label: '导出图片与选中样式', hint: 'exportImage / exportSelection 与状态样式' },
 	{ id: 'view-events', tab: 'view', label: '事件 · 选中', hint: 'onClick / onSelectChange 与 getSelectionData' },
 		{ id: 'style-heat', tab: 'style', label: '热力图', hint: '色带 / 密度场 / 光晕与作用对象' },
-		{ id: 'style-effect', tab: 'style', label: '动画效果与预热', hint: '全局 setEffects / 逐条 data.effect 与 prebake 预热' },
+		{ id: 'style-effect', tab: 'style', label: '动画效果与预热', hint: '全局 updateOptions({ effects }) / 逐条 data.effect 与 prebake 预热' },
 	{ id: 'style-line', tab: 'style', label: '线型、标记与尺寸', hint: 'lineStyle、虚线、拐点与缩放联动' },
 	{ id: 'style-rules', tab: 'style', label: '样式、符号与规则', hint: 'pointStyle / pointRules 与符号表' },
 	{ id: 'style-label', tab: 'style', label: '标签与提示', hint: '节点 / 线路标签与悬停提示' },
@@ -1365,7 +1365,7 @@ const runApiEval = () => {
 const pluginReadout = ref('当前没有运行时插件（options.plugins 里的 focusSelectionPlugin 照常挂着）')
 let pluginDispose = null
 /**
- * 运行时挂一个插件：写法与 options.plugins 里的一项完全一致（`view => hook`）——
+ * 运行时挂一个插件：写法与 options.plugins 里的一项完全一致（`(view, context) => hook`）——
  * use() 立即执行、返回卸载函数。这个示例插件自己订阅 selectChange 记账，
  * 解绑写在它自己的 destroy 里：面板的「卸载」与 view.destroy() 走的都是那一个 destroy。
  */
@@ -1439,8 +1439,8 @@ const canvasMenuRows = computed(() => {
 		{ id: 'fit', label: '适应视图（fitView）', enabled: true, reason: '' },
 		{ id: 'inspect', label: '读一下选中集（getSelectionData）', enabled: count > 0, reason: '选中集是空的' },
 		{ id: 'exportImage', label: '导出选中的图（exportSelection）', enabled: count > 0, reason: '选中集是空的' },
-		{ id: 'exportData', label: '导出选中的数据（exportSelectionData）', enabled: count > 0, reason: '选中集是空的' },
-		{ id: 'clear', label: '清空选中（select(null) / deselect()）', enabled: count > 0, reason: '本来就是空的' },
+		{ id: 'exportData', label: '导出选中的数据（exportData · scope: selection）', enabled: count > 0, reason: '选中集是空的' },
+		{ id: 'clear', label: '清空选中（selectFeatures(null) / deselect()）', enabled: count > 0, reason: '本来就是空的' },
 		{ id: 'background', label: `切底图（当前：${backgroundModeLabel.value}）`, enabled: true, reason: '' }
 	]
 })
@@ -1473,13 +1473,13 @@ const runCanvasMenuAction = (row) => {
 		exportSelectionImage()
 	}
 	else if (row.id === 'exportData') {
-		exportSelectionData()
+		exportSelectedRecords()
 	}
 	else if (row.id === 'clear') {
-		view.select(null)
+		view.selectFeatures(null)
 		syncSelectionFromView()
 		syncVisibleCount()
-		lastEvent.value = '画布菜单：select(null) 清空选中'
+		lastEvent.value = '画布菜单：selectFeatures(null) 清空选中'
 	}
 	else if (row.id === 'background') {
 		const order = BACKGROUND_MODES.map(item => item.value)
@@ -1549,7 +1549,7 @@ const confirmStationDialog = () => {
 		return
 	}
 	// 新场站直接选上：面板读数与后续编辑都跟着它（与「程序化新增线路」的新回线整批选中同一手感）
-	view.select(result.item.id)
+	view.selectFeatures(result.item.id)
 	syncSelectionFromView()
 	syncVisibleCount()
 	lastEvent.value = `画布菜单：空白处右键新增场站 → view.addPoint({ id: '${id}', name: '${name}', x: ${x}, y: ${y}, vn_kv: ${vn} }) · 落在 points[${result.index}]，已选中`
@@ -1746,6 +1746,12 @@ const buildCopyOptions = () => ({
 /** 载荷里的节点名：name / label / id 依次回落（复制与合并的读数都用它） */
 const pointLabel = item => String(item?.name ?? item?.label ?? item?.id ?? '节点')
 const mergeEnabled = ref(true)
+/** 合并触发时机：碰撞（半径相碰）/ 中心点进入目标节点区域 */
+const mergeTrigger = ref('collision')
+const MERGE_TRIGGERS = [
+	{ value: 'collision', label: '碰撞（两个节点半径相碰）' },
+	{ value: 'center', label: '中心进入目标节点区域' }
+]
 /** 碰撞容差（CSS 像素）：两个节点画在屏幕上的半径之和再加它 */
 const mergeDistance = ref(0)
 /**
@@ -1791,6 +1797,7 @@ const confirmMergeByApi = payload => new Promise((resolve) => {
 const buildMergeOptions = () => {
 	const options = {
 		enabled: mergeEnabled.value,
+		trigger: mergeTrigger.value,
 		distance: mergeDistance.value,
 		channelGroups: mergeChannelGroups.value
 	}
@@ -2697,10 +2704,10 @@ const applyChannelNodeVisibility = () => {
 	const anchors = activeChannelAnchorIds()
 	const hidden = new Set(anchors)
 	const hide = hideChannelNodes.value
-	view.updatePoints(view.getData().points.map(point => ({
+	view.updateData({ points: view.getData().points.map(point => ({
 		...point,
 		visible: hide ? !hidden.has(String(point.id)) : true
-	})))
+	})) })
 	syncChannelLabel()
 	lastEvent.value = hide
 		? `通道两端的 ${anchors.length} 个节点已隐藏：两端必须有节点，${activeChannels().length} 条通道与回线都不再显示`
@@ -2782,7 +2789,7 @@ const handleContextMenu = (payload) => {
 	// 为 false 就先把命中的这个选上再弹面板（右键落在哪、菜单就针对谁）
 	if (payload.type === 'point') {
 		if (!payload.wasSelected && payload.item?.id !== undefined && payload.item?.id !== null) {
-			viewRef.value?.select(payload.item.id)
+			viewRef.value?.selectFeatures(payload.item.id)
 		}
 		// 选完再取一次选中集读数：面板上的「把选中的 N 个并拢」按的是点下去那一刻的实际选中集
 		pointMenu.value = { ...payload, kept: payload.wasSelected === true, selection: viewRef.value?.getSelectionData() ?? payload.selection }
@@ -2886,10 +2893,10 @@ const handlePointMerge = (payload) => {
 				target: `目标 ${target}`,
 				detail: `并进目标之后：尺寸取双方最大、图标优先目标；撞在一起的通道${mergeChannelGroups.value === 'merge' ? '合成一个分组' : '各自保留分组'}`
 			}
-			lastEvent.value = `节点相撞：${source} 拖到了 ${target} 上 · 组件只给载荷与 confirm() / cancel()，合不合并由 demo 自己写的这个弹层裁决`
+			lastEvent.value = `节点合并：${source} 拖到了 ${target} 上（${payload.trigger === 'center' ? '中心进入目标区域' : '碰撞'}）· 组件只给载荷与 confirm() / cancel()，合不合并由 demo 自己写的这个弹层裁决`
 			return
 		}
-		lastEvent.value = `节点相撞：${source} 拖到了 ${target} 上 · 裁决交给 options.merge.confirm（面板上切「直接合并 / 先调接口」）`
+		lastEvent.value = `节点合并：${source} 拖到了 ${target} 上（${payload.trigger === 'center' ? '中心进入目标区域' : '碰撞'}）· 裁决交给 options.merge.confirm（面板上切「直接合并 / 先调接口」）`
 		return
 	}
 	if (payload.phase === 'confirm') {
@@ -2990,7 +2997,7 @@ const exportSelectionImage = async () => {
 	lastEvent.value = `导出选中为图片（${imageKind}）：${result.counts.points} 个节点${result.counts.lines ? ` + ${result.counts.lines} 条线路` : ''}已下载 · 出图时组件把别的要素临时藏起来、相机对到导出范围，出完自动还原`
 }
 /** 导出选中为数据：points / lines 是拷贝（改它不影响组件内部那一份），直接存成 JSON */
-const exportSelectionData = async () => {
+const exportSelectedRecords = async () => {
 	const view = viewRef.value
 	if (!view) {
 		return
@@ -3014,7 +3021,7 @@ const exportSelectionData = async () => {
 /* -------------------- 导出数据：节点 / 线路 / 通道 / 拐点分组分开取 -------------------- */
 /** 导出整份时的口径：四份分开（缺省）/ new.json / test.json —— 与面板上的下拉一一对应 */
 const exportDataFormat = ref('view')
-/** 拐点要不要连没编辑过的分组一起列（exportParallelGroups 的 all） */
+/** 拐点要不要连没编辑过的分组一起列（exportData({ parts: ['waypoint'] }) 的 all） */
 const exportDataAll = ref(false)
 /**
  * 导出分项（多选）：选什么就导什么，默认场站 + 通道。
@@ -3045,11 +3052,11 @@ const exportPartsOption = () => (exportParts.value.length ? [...exportParts.valu
 /** 分项导出：一次只取一份，节点 / 线路 / 通道 / 拐点各是各的口径 */
 const exportPart = ref('channels')
 const EXPORT_PARTS = [
-	{ value: 'station', label: '节点 · station_data（new.json）', file: 'gis-station-data', run: (view, options) => view.exportStationData(options) },
-	{ value: 'points', label: '节点 · point_data（test.json）', file: 'gis-point-data', run: (view, options) => view.exportPointData(options) },
-	{ value: 'lines', label: '线路 · line_data（test.json）', file: 'gis-line-data', run: (view, options) => view.exportLineData(options) },
-	{ value: 'channels', label: '通道 · channel_data（new.json）', file: 'gis-channel-data', run: (view, options) => view.exportChannelData(options) },
-	{ value: 'groups', label: '拐点 · parallel_groups（test.json）', file: 'gis-parallel-groups', run: (view, options) => view.exportParallelGroups(options) }
+	{ value: 'station', label: '节点 · station_data（new.json）', file: 'gis-station-data', run: (view, options) => view.exportData({ ...options, format: 'new', parts: ['station'] }) },
+	{ value: 'points', label: '节点 · point_data（test.json）', file: 'gis-point-data', run: (view, options) => view.exportData({ ...options, format: 'test', parts: ['station'] }) },
+	{ value: 'lines', label: '线路 · line_data（test.json）', file: 'gis-line-data', run: (view, options) => view.exportData({ ...options, format: 'test', parts: ['line'] }) },
+	{ value: 'channels', label: '通道 · channel_data（new.json）', file: 'gis-channel-data', run: (view, options) => view.exportData({ ...options, format: 'new', parts: ['channel'] }) },
+	{ value: 'groups', label: '拐点 · parallel_groups（test.json）', file: 'gis-parallel-groups', run: (view, options) => view.exportData({ ...options, format: 'test', parts: ['waypoint'] }) }
 ]
 const exportDataReadout = ref('导出数据：—')
 const exportDataSample = ref('')
@@ -3086,7 +3093,7 @@ const exportDataToFile = () => {
 	refreshExportSample()
 }
 /**
- * 导出「选中的这一撮」的业务表数据（exportSelectionData）：选中口径与「导出选中为数据」一样，
+ * 导出「选中的这一撮」的业务表数据（exportData · scope: selection）：选中口径与「导出选中为数据」一样，
  * 出的却是分项记录（场站 / 通道 / 线路 / 拐点），同样跟着上面的分项勾选走。
  */
 const exportSelectionPartsToFile = () => {
@@ -3094,7 +3101,7 @@ const exportSelectionPartsToFile = () => {
 	if (!view) {
 		return
 	}
-	const result = view.exportSelectionData({ parts: exportPartsOption(), all: exportDataAll.value })
+	const result = view.exportData({ scope: 'selection', parts: exportPartsOption(), all: exportDataAll.value })
 	if (!result.ok) {
 		exportReadout.value = `导出选中分项：${result.reason}`
 		lastEvent.value = `导出选中分项没成功：${result.reason}`
@@ -3180,7 +3187,7 @@ const refreshDataShape = () => {
 	const labelChannelId = (memberChannel ?? channels[0])?.channelId ?? null
 	const labelChannelRow = labelChannelId === null || labelChannelId === undefined
 		? null
-		: (view.exportChannelData({ channels: [labelChannelId], labels: true }).channel_data?.[0] ?? null)
+		: (view.exportData({ format: 'new', parts: ['channel'], channels: [labelChannelId], labels: true }).channel_data?.[0] ?? null)
 	// 面板上只摆带标签的那几条回线（一条都没有就摆前几条），完整结构走「打印完整结构到控制台」
 	const labelChannelLines = labelChannelRow
 		? (labelChannelRow.line_data.some(row => row.labels?.length)
@@ -3356,8 +3363,8 @@ const syncParallelGroups = () => {
 		: '新增拐点集合：—'
 	parallelGroupsJson.value = groups.length ? `${JSON.stringify(groups.slice(0, 2), null, 1)}${groups.length > 2 ? `\n… 共 ${groups.length} 组` : ''}` : ''
 }
-/** 导出拐点集合：结构就是 test.json 的 parallel_groups，可以直接回写业务数据 */
-const exportParallelGroups = async () => {
+/** 复制拐点集合：结构就是 test.json 的 parallel_groups，可以直接回写业务数据 */
+const copyParallelGroupRecords = async () => {
 	if (!parallelGroups.value.length) {
 		lastEvent.value = '还没有新增拐点：Ctrl + 点击线路加点、拖动拐点之后，通道与线路会各成一组'
 		return
@@ -4287,7 +4294,7 @@ watch([shortcutBoxSelect, shortcutMultiSelect, shortcutAddWaypoint, shortcutDupl
 })
 // 复制的开关与落点偏移、合并的开关 / 容差 / 确认方式 / 通道分组：只改「怎么响应」，数据不动
 watch([copyEnabled, copyOffsetMode], () => viewRef.value?.updateOptions({ copy: buildCopyOptions() }))
-watch([mergeEnabled, mergeDistance, mergeConfirmMode, mergeChannelGroups], () => viewRef.value?.updateOptions({ merge: buildMergeOptions() }))
+watch([mergeEnabled, mergeTrigger, mergeDistance, mergeConfirmMode, mergeChannelGroups], () => viewRef.value?.updateOptions({ merge: buildMergeOptions() }))
 // 通道选中模式：只影响下一次点选怎么摊开，updateOptions 不用重排场景
 watch(channelSelectMode, value => viewRef.value?.updateOptions({ channelSelectMode: value }))
 // 选中抬层：改了立刻整份重排一次（这类选项只影响绘制顺序）
@@ -4896,7 +4903,7 @@ const applyPerPointSymbol = () => {
 	}
 	const { points } = view.getData()
 	const next = points.map((point, index) => perPointSymbol.value ? (index % 24 === 0 ? { ...point, symbol: PER_POINT_SYMBOL } : point) : point.symbol === undefined ? point : { ...point, symbol: undefined })
-	view.updatePoints(next)
+	view.updateData({ points: next })
 	lastEvent.value = perPointSymbol.value
 		? `已给 ${Math.ceil(next.length / 24)} 个节点单独配置符号（数据里写 symbol，优先级最高）`
 		: '已清掉逐点符号，节点回到规则表的样子'
@@ -4906,7 +4913,7 @@ const toggleDraggable = (value) => {
 	const view = viewRef.value
 	if (view) {
 		const { points } = view.getData()
-		view.updatePoints(points.map((point, index) => ({ ...point, draggable: index % 2 === 0 ? value : false })))
+		view.updateData({ points: points.map((point, index) => ({ ...point, draggable: index % 2 === 0 ? value : false })) })
 	}
 }
 /** 选中读数：交互造成的选中走 onSelect，通过接口设置的选中要自己同步一份 */
@@ -4937,7 +4944,7 @@ const syncSelectionFromView = () => {
 	}
 }
 const selectFirstLine = () => {
-	viewRef.value?.select('line-0')
+	viewRef.value?.selectFeatures('line-0')
 	syncSelectionFromView()
 }
 /** 选中回线最多的那条通道的中间回线：拐点属于通道，整条通道的拐点都会显示 */
@@ -4946,13 +4953,13 @@ const selectChannelLine = () => {
 	const channel = [...(view?.getChannels() ?? [])].sort((left, right) => right.lineIndexes.length - left.lineIndexes.length)[0]
 	const line = channel ? view?.getData().lines[channel.lineIndexes[Math.floor(channel.lineIndexes.length / 2)]] : undefined
 	if (view && line) {
-		view.select(String(line.id))
+		view.selectFeatures(String(line.id))
 	}
 	syncSelectionFromView()
 }
 /** Ctrl 点击多个节点等价于框选：多选之后拖动任意一个，整组一起移动 */
 const selectSeveralNodes = () => {
-	viewRef.value?.select(['node-1', 'node-2', 'node-3', 'node-4'])
+	viewRef.value?.selectFeatures(['node-1', 'node-2', 'node-3', 'node-4'])
 	syncSelectionFromView()
 }
 /** 框选接口也可以直接调用：给个覆盖左上角 1/4 画布的矩形 */
@@ -5097,10 +5104,10 @@ const mergeSelectedChannel = () => {
 			return
 		}
 		const name = channelRenameText.value.trim()
-		view.setChannelName(id, name === '' ? null : name)
+		view.updateChannel(id, { name: name === '' ? null : name })
 		lastEvent.value = name === ''
-			? `通道 ${String(id)} 摘掉名称（setChannelName(id, null)）`
-			: `通道 ${String(id)} 改名「${name}」（setChannelName）—— 悬停提示的 {name} 与搜索都跟着变`
+			? `通道 ${String(id)} 摘掉名称（updateChannel(id, { name: null })）`
+			: `通道 ${String(id)} 改名「${name}」（updateChannel）—— 悬停提示的 {name} 与搜索都跟着变`
 		syncChannelLabel()
 	}
 	/** 加一条回线到通道：挑第一条还没挂通道的线路（认不出 / 已在别的通道里的由 addChannelLines 挡下并说明） */
@@ -5336,7 +5343,7 @@ const readSelectionByApi = () => {
  * 节点右键面板：组件本身不弹任何菜单，右键载荷里就已经给全了 ——
  * wasSelected（命中前它在不在选中集里）+ selection（整份选中集读数）。
  * 这里的规矩是常见的那一套：右键已经选中的节点保留整份选中集，右键没选中的节点先把它选上再弹面板；
- * 面板上的按钮各走一个公开方法（focusOn / copyPoint / mergeSelectedPoints / removePoints / select(null)）。
+ * 面板上的按钮各走一个公开方法（focusOn / copyPoint / mergeSelectedPoints / removePoints / selectFeatures(null)）。
  */
 const pointMenu = ref(null)
 const closePointMenu = () => {
@@ -5413,7 +5420,7 @@ const pointMenuRows = computed(() => {
 		{ id: 'merge', label: `把选中的 ${count} 个并拢（mergeSelectedPoints）`, enabled: count >= 2, reason: '选中两个以上节点才谈得上合并' },
 		{ id: 'remove', label: '删掉这个节点（removePoints）', enabled: true, reason: '' },
 		{ id: 'deselect', label: '取消它的选中（deselect）', enabled: true, reason: '' },
-		{ id: 'clear', label: '清空全部选中（select(null)）', enabled: count > 0, reason: '本来就是空的' }
+		{ id: 'clear', label: '清空全部选中（selectFeatures(null)）', enabled: count > 0, reason: '本来就是空的' }
 	]
 })
 const runPointMenuAction = (row) => {
@@ -5445,7 +5452,7 @@ const runPointMenuAction = (row) => {
 		lastEvent.value = `右键面板：deselect(${JSON.stringify(ref)}) —— ${formatFeature(payload)} 的选中已取消，其余选中不受影响`
 	}
 	else if (row.id === 'clear') {
-		view.select(null)
+		view.selectFeatures(null)
 		lastEvent.value = '右键面板：清空选中'
 	}
 	closePointMenu()
@@ -6249,6 +6256,12 @@ const deselectFirstSelected = () => {
 				<span class="demo-control-hint">{{ copyReadout }}</span>
 				<label><input v-model="copyRollback" type="checkbox" /> 复制后模拟「接口失败」：立刻 payload.revert() 回滚</label>
 				<label><input v-model="mergeEnabled" type="checkbox" /> 可合并节点（拖动一个节点撞上另一个）</label>
+				<label class="demo-slider">
+					合并触发时机
+					<select v-model="mergeTrigger">
+						<option v-for="item in MERGE_TRIGGERS" :key="item.value" :value="item.value">{{ item.label }}</option>
+					</select>
+				</label>
 				<label class="demo-slider">
 					合并容差
 					<input v-model.number="mergeDistance" type="range" min="0" max="40" step="1" />
@@ -6311,7 +6324,7 @@ const deselectFirstSelected = () => {
 				<span class="demo-control-hint">导出的是当前这一帧：格式与背景对「整幅」和「选中」两边都管用</span>
 				<label><input v-model="exportWithLines" type="checkbox" /> 导出选中时携带线路（两端都在选中集里的）</label>
 				<button type="button" @click="exportSelectionImage()">导出选中为图片</button>
-				<button type="button" @click="exportSelectionData()">导出选中为数据</button>
+				<button type="button" @click="exportSelectedRecords()">导出选中为数据</button>
 				<span class="demo-control-hint">{{ exportReadout }}</span>
 				<label class="demo-slider">
 					选中点样式
@@ -6653,7 +6666,7 @@ const deselectFirstSelected = () => {
 			</div>
 			<div class="demo-controls demo-controls--shape">
 				<label class="demo-slider">
-					单份（老接口）
+					单份
 					<select v-model="exportPart" title="一次只取一份：节点 / 线路 / 通道 / 拐点各是各的口径，互不混在一起" @change="refreshExportSample()">
 						<option v-for="item in EXPORT_PARTS" :key="item.value" :value="item.value">{{ item.label }}</option>
 					</select>
@@ -6661,7 +6674,7 @@ const deselectFirstSelected = () => {
 				<button type="button" @click="exportPartToFile()">导出这一份（下载 JSON）</button>
 			</div>
 			<div class="demo-controls demo-controls--shape">
-				<span class="demo-control-hint">分项多选：选什么就导什么，默认场站 + 通道；勾了通道或线路会自动带上拐点（通道的路由与线路的折线都靠拐点说话），一个都不勾就是四份全要。节点与通道走 new.json 那套列名（station_data / channel_data：通道的 line_data 里是回线、coords 是整条通道的路由），线路与拐点走 test.json 那套（line_data / parallel_groups：拐点只记在集合里，不散进每条回线）；业务列（max_loading_rate 这类）原样透传，warnings 会说哪个 id 没找到。「导出选中数据的这几份」走 exportSelectionData —— 选中口径与「导出选中为数据」一样（框选 / 多选出来的那批节点，线路取两端都在里面的），出的却是分项业务表。下面这一段是「只取头两个节点 / 两条线 / 一条通道」的样例</span>
+				<span class="demo-control-hint">分项多选：选什么就导什么，默认场站 + 通道；勾了通道或线路会自动带上拐点（通道的路由与线路的折线都靠拐点说话），一个都不勾就是四份全要。节点与通道走 new.json 那套列名（station_data / channel_data：通道的 line_data 里是回线、coords 是整条通道的路由），线路与拐点走 test.json 那套（line_data / parallel_groups：拐点只记在集合里，不散进每条回线）；业务列（max_loading_rate 这类）原样透传，warnings 会说哪个 id 没找到。「导出选中数据的这几份」统一走 exportData({ scope: 'selection' }) —— 选中口径与「导出选中为数据」一样（框选 / 多选出来的那批节点，线路取两端都在里面的），出的却是分项业务表。下面这一段是「只取头两个节点 / 两条线 / 一条通道」的样例</span>
 				<pre class="demo-groups">{{ exportDataSample || '点「刷新样例」看当前口径下的导出结构' }}</pre>
 			</div>
 				</div>
@@ -6719,7 +6732,7 @@ const deselectFirstSelected = () => {
 				<button type="button" @click="mergeSelectedChannel">合并分组</button>
 				<button type="button" @click="separateSelectedChannelGroups">加拐点分开分组</button>
 				<button type="button" @click="clearSeparatedChannelGroups">去掉分开的拐点</button>
-				<input v-model="channelRenameText" type="text" placeholder="通道名称（留空 = 摘掉）" title="setChannelName：悬停提示的 {name}、标签模板与搜索都取它" />
+				<input v-model="channelRenameText" type="text" placeholder="通道名称（留空 = 摘掉）" title="updateChannel({ name })：悬停提示的 {name}、标签模板与搜索都取它" />
 				<button type="button" @click="renameSelectedChannel">改名</button>
 				<button type="button" @click="addLineToSelectedChannel">加一条回线</button>
 				<button type="button" @click="removeLineFromSelectedChannel">摘一条回线</button>
@@ -7116,7 +7129,7 @@ const deselectFirstSelected = () => {
 				<button type="button" @click="selectQuarterBox">选中左上 1/4</button>
 				<button type="button" @click="addWaypointToFirstLine">给首条线路加点</button>
 				<button type="button" @click="addWaypointToChannel">给通道加点</button>
-				<button type="button" @click="exportParallelGroups">导出拐点集合</button>
+				<button type="button" @click="copyParallelGroupRecords">复制拐点集合</button>
 				<button type="button" @click="deselectFirstSelected">取消选中一个（deselect）</button>
 				<button type="button" @click="clearSelection">清空选中（deselect）</button>
 				<span class="demo-control-hint">{{ selectedLabel }}</span>
@@ -7145,7 +7158,7 @@ const deselectFirstSelected = () => {
 				<div class="demo-controls">
 					<label class="demo-slider"><input v-model="effectLineOn" type="checkbox" @change="applyEffects" />线路动点</label>
 					<label class="demo-slider"><input v-model="effectPointOn" type="checkbox" @change="applyEffects" />节点涟漪</label>
-					<button type="button" @click="applyEffects">下发全局配置（setEffects）</button>
+					<button type="button" @click="applyEffects">下发全局配置（updateOptions）</button>
 					<span class="demo-control-hint">动画效果：{{ effectText }}</span>
 				</div>
 				<div class="demo-controls">
@@ -7171,7 +7184,7 @@ const deselectFirstSelected = () => {
 					<span class="demo-control-hint">预热（prebake）：{{ prebakeText }}</span>
 				</div>
 				<div class="demo-controls">
-					<details class="demo-hint-more"><summary>说明</summary><span class="demo-control-hint">效果分两层：全局缺省（<code>setEffects</code> 或 <code>options.effects</code>）与逐要素（数据里的 <code>points[].effect</code> / <code>lines[].effect</code>）。上面那三个「逐条覆盖」按钮演示的就是逐要素的三种写法：写一份自己的、<code>true</code> 交回全局、<code>false</code> 这几条不动 —— 只在数据里逐条配也会动，全局一个都不配也行。三层「关」是四件事：什么都不配 / <code>effects: false</code> 一处关掉（谁都别动）/ <code>effects.line: false</code> 只关全局那一份 / 逐条 <code>effect: false</code>。线路的图标按弧长跑（拐点上连着走、朝向跟着所在那一段），节点涟漪每帧只改一个 <code>u_time</code>，两者都只铺视口里的、按「画多少」付费；页签切到后台或系统要求减少动态效果时直接停帧（<code>respectReducedMotion</code> 缺省尊重它，想照跑就关掉）。预热不改变画面：它把「会画到的那些贴图」在首帧之前烤好，省掉第一次画到时的解码 + 光栅化，稳态帧与它无关，再烤一遍命中的是缓存。收组合有两种写法：<strong>按实际组合（精确）</strong>走 <code>getSymbolCombos()</code>，把这份数据真正会用到的组合收出来（真实数据实测 <strong>26 条</strong>：照着它配预热零张新画布，逐条命中）；<strong>按规则表全排列（粗）</strong>是笛卡尔积，颜色与尺寸由同一个字段决定时（都跟着电压走那种）会把用不到的组合也烤一遍 —— 同一份数据收出 <strong>1741 条</strong>、多烤 21 倍画布，无头下首帧从 29 ms 掉到 963 ms。<strong>「提前预知」的正确用法是清单要准，不是越多越好。</strong></span></details>
+					<details class="demo-hint-more"><summary>说明</summary><span class="demo-control-hint">效果分两层：全局缺省（<code>updateOptions({ effects })</code> 或 <code>options.effects</code>）与逐要素（数据里的 <code>points[].effect</code> / <code>lines[].effect</code>）。上面那三个「逐条覆盖」按钮演示的就是逐要素的三种写法：写一份自己的、<code>true</code> 交回全局、<code>false</code> 这几条不动 —— 只在数据里逐条配也会动，全局一个都不配也行。三层「关」是四件事：什么都不配 / <code>effects: false</code> 一处关掉（谁都别动）/ <code>effects.line: false</code> 只关全局那一份 / 逐条 <code>effect: false</code>。线路的图标按弧长跑（拐点上连着走、朝向跟着所在那一段），节点涟漪每帧只改一个 <code>u_time</code>，两者都只铺视口里的、按「画多少」付费；页签切到后台或系统要求减少动态效果时直接停帧（<code>respectReducedMotion</code> 缺省尊重它，想照跑就关掉）。预热不改变画面：它把「会画到的那些贴图」在首帧之前烤好，省掉第一次画到时的解码 + 光栅化，稳态帧与它无关，再烤一遍命中的是缓存。收组合有两种写法：<strong>按实际组合（精确）</strong>走 <code>getSymbolCombos()</code>，把这份数据真正会用到的组合收出来（真实数据实测 <strong>26 条</strong>：照着它配预热零张新画布，逐条命中）；<strong>按规则表全排列（粗）</strong>是笛卡尔积，颜色与尺寸由同一个字段决定时（都跟着电压走那种）会把用不到的组合也烤一遍 —— 同一份数据收出 <strong>1741 条</strong>、多烤 21 倍画布，无头下首帧从 29 ms 掉到 963 ms。<strong>「提前预知」的正确用法是清单要准，不是越多越好。</strong></span></details>
 				</div>
 				</div>
 				<div v-show="activePanel === 'ops-quality'" class="demo-panel-body">