将SVG从Highcharts数据转换为数据点

一尘不染

将SVG从Highcharts数据转换为数据点

selenium

我希望从该网站的mma 数据中抓取数据并解析一些highcharts表。我单击的链接与selenium，然后切换到图表。我转到该站点，然后在Artem
Lobov行的Pinnacle列中单击+420。这将创建一个弹出图表。然后，我切换到活动元素。我想捕获由highcharts绘制的图形以响应点击。

我以以下方式使用selenium：

actions = ActionChains(driver)
actions.move_to_element(driver.find_element_by_id(pin_id))
actions.click()
actions.perform()
time.sleep(3)
driver.switch_to_active_element()

我能够单击链接并获得图表，但我对highcharts的工作方式有些迷茫。
我试图解析highcharts系列组在这里
，并在图表中获取值。

我相信可以通过以下方式找到数据：

soup = bs4.BeautifulSoup(open(driver.page_source), "lxml")
data = soup.find_all('g', {"class":"highcharts-series-group"})[-1].find_all("path")

但是，这提供了以下内容，并且不清楚如何从数据创建图表。如评论中所述，它似乎是svg。

在检查过程中，数据似乎在其中 <g class="highcharts-series"，<g class="highcharts-series- tracker但不清楚，高图表根据该数据将其绘制成图形。

高图如何显示已保存数据中的图形？有没有一种干净的方法可以从显示的highcharts-series-group中获取数据？

阅读 348

2020-06-26

共1个答案

一尘不染

我不知道如何将SVG数据转换为您提到的图形上显示的内容，但是编写了以下Selenium Python脚本：

from selenium import webdriver
import time

driver = webdriver.Chrome()
driver.get('https://www.bestfightodds.com/events/ufc-fight-night-108-swanson-vs-lobov-1258')
actions = webdriver.ActionChains(driver)
actions.move_to_element(driver.find_element_by_id('oID1013467091'))
actions.click()
actions.perform()
time.sleep(3)
driver.switch_to_active_element()
chart_number = driver.find_element_by_id('chart-area').get_attribute('data-highcharts-chart')
chart_data = driver.execute_script('return Highcharts.charts[' + chart_number + '].series[0].options.data')
for point in chart_data:
    e = driver.execute_script('return oneDecToML('+ str(point.get('y')) + ')')
    print(point.get('x'), e)

在这里，我们使用了Highcharts API和页面源代码中的一些js，它将此图表的服务器响应转换为我们在图表上看到的内容。

2020-06-26