如何使用Selenium与网页地图元素交互实现航点批量遍历

问题背景 #

近期在Python环境下使用Selenium Chrome驱动开展开发工作，尝试与NASA火星地图界面（地址：https://mars.nasa.gov/maps/location/?mission=MSL&site=NOW）交互时遇到问题。
核心目标是按时间顺序遍历地图上所有航点，依次将地图居中到对应航点，还原好奇号火星车的行进路线。
最初梳理的可行思路是借助工具栏元素实现：点击对应工具栏元素时地图会自动居中到关联航点，但落地时遇到障碍：需要先鼠标点击特定航点才能触发工具栏元素的关联绑定，之后点击工具栏才会将视图居中到对应航点。理想状态是通过编程方式直接修改工具栏元素的指向，在指定整数范围内遍历所有航点，不需要逐个点选航点触发绑定。
目前已实现工具栏元素的定位和点击操作，但无法修改元素绑定的航点ID，若该方案实现成本过高，也可接受其他替代实现方案。

界面示例：

初始版本代码 #

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By

import time

driver = webdriver.Chrome()
driver.get("https://mars.nasa.gov/maps/location/?mission=MSL&site=NOW")

time.sleep(5)  # 等待页面加载

# 定位工具栏元素
elem = driver.find_element_by_id("mainDescPointInner") 
elem.click()

for i in range(1, 1000):
     # 待实现：修改元素绑定的目标航点
     elem.click()

已验证可行的替代方案 #

不需要修改工具栏元素的航点绑定逻辑，直接定位地图渲染出的所有航点交互元素，逐个模拟点击即可触发地图自动居中，实现代码如下：

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.common.action_chains import ActionChains
import time

driver = webdriver.Chrome()
driver.get("https://mars.nasa.gov/maps/location/?mission=MSL&site=NOW")
time.sleep(5) # 等待页面、地图瓦片及航点元素渲染完成

# 抓取地图容器内SVG渲染的所有可交互航点
waypoint_list = driver.find_elements(By.XPATH,
    '//*[@id="map"]//descendant::*[name()="svg"]//descendant::*[@class="waypoints leaflet-interactive"]')

# 逐个点击航点，触发地图自动居中逻辑
for waypoint in waypoint_list:
    ActionChains(driver).click(waypoint).perform()
    # 可按需添加间隔延时，方便观察路线切换效果、或抓取当前航点的关联数据
    time.sleep(0.5)

方案说明 #

• 该方案直接绕过工具栏元素的绑定修改逻辑，通过XPath定位Leaflet地图引擎渲染的所有航点交互元素，模拟原生鼠标点击即可触发地图内置的居中逻辑，无需额外处理工具栏关联。
• 高版本Selenium已废弃find_element_by_id、find_element_by_xpath这类旧API，统一使用find_element(By.xxx, 定位值)、find_elements(By.xxx, 定位值)的写法即可，避免版本兼容报错。
• 若需要严格按时间顺序遍历，可在遍历前先提取每个航点元素自带的编号、采集时间属性，对航点列表排序后再执行点击操作，保证路线还原顺序正确。
• 固定时长的time.sleep等待稳定性较差，可替换为Selenium的显式等待WebDriverWait，等航点元素全部渲染完成后再执行抓取，降低偶发的元素定位失败概率。

内容的提问来源于stack exchange，提问作者John Szatmari