|
|
@@ -202,21 +202,9 @@ const SupplyChainMap: React.FC<SupplyChainMapProps> = ({
|
|
|
{ id: 'chain4', type: 'industryChain', position: { x: 1237.87, y: 761.84 }, name: '产业链4' }
|
|
|
];
|
|
|
|
|
|
- // 默认连接线数据
|
|
|
- const defaultConnections: ConnectionLine[] = [
|
|
|
- { id: 'conn1', from: 'base1', to: 'chain1' },
|
|
|
- { id: 'conn2', from: 'base2', to: 'chain2' },
|
|
|
- { id: 'conn3', from: 'base3', to: 'chain3' },
|
|
|
- { id: 'conn4', from: 'base4', to: 'chain4' },
|
|
|
- { id: 'conn5', from: 'chain1', to: 'chain2' },
|
|
|
- { id: 'conn6', from: 'chain2', to: 'chain3' }
|
|
|
- ];
|
|
|
|
|
|
- const displayPoints = points.length > 0 ? points : defaultPoints;
|
|
|
- const displayConnections = connections.length > 0 ? connections : defaultConnections;
|
|
|
|
|
|
- // 创建点映射以便快速查找
|
|
|
- const pointMap = new Map(displayPoints.map(point => [point.id, point]));
|
|
|
+ const displayPoints = points.length > 0 ? points : defaultPoints;
|
|
|
|
|
|
return (
|
|
|
<div className="absolute contents left-[529.88px] top-[calc(50%+64.03px)] translate-y-[-50%]">
|
|
|
@@ -232,32 +220,7 @@ const SupplyChainMap: React.FC<SupplyChainMapProps> = ({
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- {/* 供应链网络连接线 */}
|
|
|
- <div className="absolute inset-[19.27%_4.17%_13.01%_27.6%]">
|
|
|
- {/* 静态连接线背景 */}
|
|
|
- <img
|
|
|
- alt="供应链网络"
|
|
|
- className="block max-w-none size-full"
|
|
|
- src="/supply-chain/union1.svg"
|
|
|
- />
|
|
|
-
|
|
|
- {/* 动态连接线 */}
|
|
|
- {displayConnections.map(connection => {
|
|
|
- const fromPoint = pointMap.get(connection.from);
|
|
|
- const toPoint = pointMap.get(connection.to);
|
|
|
-
|
|
|
- if (!fromPoint || !toPoint) return null;
|
|
|
|
|
|
- return (
|
|
|
- <ConnectionLine
|
|
|
- key={connection.id}
|
|
|
- line={connection}
|
|
|
- fromPoint={fromPoint}
|
|
|
- toPoint={toPoint}
|
|
|
- />
|
|
|
- );
|
|
|
- })}
|
|
|
- </div>
|
|
|
|
|
|
{/* 定位点 */}
|
|
|
{displayPoints.map(point => {
|