1000多条弧线图，如何在没有gpu的电脑上不卡顿

- **L7 Version**: 2.20.10
- **Platform**:window
- **Mini Showcase(like screenshots)**:
- 
- **CodePen Link**:
``

加上飞线图的动效，没有GPU的电脑或者GPU很差的话就会很卡，浏览器直接卡死
` useEffect(() => {
if (!scene || !dotData.length || !line.length || !marker.length) return;
scene.removeAllLayer();
const dotPoint = new PointLayer({ zIndex: 3 })
.source(dotData, {
parser: {
type: "json",
x: "lng",
y: "lat",
},
})
.shape("circle")
.color("#ffed11")
.animate(true)
.size(15);

// @ts-ignore
const flydata = line;
console.log('line---->num', line)

const flyLine2 = new LineLayer({ zIndex: 4, blend: 'normal', autoFit: false})
.source(flydata, {
parser: {
type: "json",
coordinates: "coord",
},
})
.shape("arc")
// .active(true)
.size(2)
.style({
lineType: "solid",
// dashArray: [5, 5],
opacity: 0.5,
segmentNumber: 10
});
console.log('line---->num', flydata)

flyLine2.color("value", (value) => {
return getLineColor(value);
});
flyLine2.size("value", (value) => {
return getLineWidth(value);
});

const flyLine = new LineLayer({ blend: "normal", zIndex: 5 })
.source(flydata, {

parser: {
type: "json",
coordinates: "coord",
},
})
.color("#ff6b34")
.texture("arrow")
.shape("arc")
.size(15)
.animate({
duration: 2,
interval: 1,
trailLength: 10,
})
.style({
segmentNumber: 10,
textureBlend: "replace",
lineTexture: true, // 开启线的贴图功能
iconStep: 30, // 设置贴图纹理的间距
});

flyLine2.style({
opacity: {
field: "value",
value: [0.5, 1, 1, 1, 1],
},
});

flyLine.on("mousemove", (val) => {
const { data } = val.feature;
let offsetx = 0;
const offsety = 0;
let anchorPosition = "bottom";
if (val.x - 400 < 250) {
offsetx = 245;
anchorPosition = "left";
}
if (val.x + 250 >= 1520) {
offsetx = -245;
anchorPosition = "right";
}
if (val.y - 245 <= 210) {
anchorPosition = "top";
}
if (val.y - 245 <= 100 && val.x - 400 < 250) {
anchorPosition = "top-left";
}
if (val.y - 245 <= 100 && val.x + 250 >= 1520) {
anchorPosition = "top-right";
}

if (popUpRef?.current) {
scene.removePopup(popUpRef.current);
popUpRef.current = null;
}

const htmlStr = ``

console.log("---->anchorPosition", anchorPosition);
const popOptions = {
anchor: anchorPosition,
closeButton: false,
};
const popUpTemp = new Popup(popOptions);
popUpRef.current = popUpTemp;
popUpTemp.setLngLat([val.lngLat.lng, val.lngLat.lat]);
popUpTemp.setHTML(htmlStr);
// popUpTemp.addTo(scene);
scene.addPopup(popUpTemp);
setArrowClass(getArrowClass(anchorPosition));
});

flyLine.on("mouseout", (val) => {
scene.removePopup(popUpRef.current);
popUpRef.current = null;
});

const pointLayer = new PointLayer({zIndex: 8, blend: 'normal' })
.source(marker, { parser: { type: "json", x: "lng", y: "lat" } })
.shape("name", "text")
// .shape("triangle")
.size(16)
.color("#fff")
.style({
textOffset: [-10, 15],
// stroke: '#000', // 描边颜色
// strokeWidth: 0.1, // 描边宽度
// strokeOpacity: 0.6,
})
scene.addLayer(dotPoint);
scene.addLayer(flyLine2);
scene.addLayer(flyLine);
scene.addLayer(pointLayer);

// pointLayer.show()
// lineLayerRef.current = [dotPoint, flyLine, flyLine2, pointLayer];

}, [scene, line, dotData, marker]);
`