Извлечение данных из диаграмм или таблиц, созданных с помощью инструментов визуализации Google с использованием Python и Selenium

Question

Я пытаюсь собрать данные из таблиц и диаграмм с этого сайта: https://www.portfoliovisualizer.com/fund-performance?s=y&symbol=MUB&symbols=VTEB&benchmark=VWITX&startDate=1%2F1%2F2015&endDate=1%2F31%2F2020

Сайт содержит обе таблицы * stati c, которые я могу анализировать без любые проблемы с использованием запросов и BeautifulSoup, а также некоторых динамически генерируемых таблиц и диаграмм, которые создаются с помощью инструментов визуализации Google. Для динамически сгенерированных частей я использовал веб-драйвер Selenium и смог получить исходный код страницы после генерации динамических c диаграмм и таблиц, поэтому я вижу значения, которые я хочу получить. Однако я не знаю, как их вытащить, так как они отображаются в источнике страницы в таких сегментах, как приведенный ниже:

Цитата

    <div id="chartDiv2" style="width: 900px; height: 500px;"></div>
    <script>
    function getChartData2() {
    var data2 = google.visualization.arrayToDataTable([['Year', 'Vanguard Tax-Exempt Bond ETF', 'iShares 
    National Muni Bond ETF', 'Vanguard Interm-Term Tx-Ex Inv'],['2015', 0.02622989191078684, 
    0.027694140180976934, 0.020218079771240793],['2016', 0.0017793103198122662, -0.0016512224730700353, 
    8.245768963E-4],['2017', 0.04691417159814648, 0.04723004573804612, 0.04534581696422735],['2018', 
    0.010468419206658197, 0.0092958557816043, 0.01252249494095059],['2019', 0.07344514685363279, 
    0.07055205700158873, 0.06781218369439523],['2020', 0.017556966753828895, 0.01659204635238365, 
    0.0158935038009671]]);
    var formatter2 = new google.visualization.NumberFormat({ pattern: '0.00%' });
    formatter2.format(data2, 1);
    formatter2.format(data2, 2);
    formatter2.format(data2, 3);
    var chart2 = new google.visualization.ColumnChart(document.getElementById('chartDiv2'));
    var options2 = { title: 'Annual Returns', legend: { textStyle: { fontSize: 13 } }, hAxis: { title: 
    'Year'}, vAxis: { dummy: false, title: 'Annual Return', format:'0.0%', minValue: 0}, focusTarget: 
    'category'};
    return [chart2, data2, options2];
    }
    </script>

Цитата

Любой поиск супа с помощью find или find_all натыкается на самый дальний стол (который, кажется, охватывает всю веб-страницу). Я новичок в Python, поэтому любая помощь будет очень признательна. Прямо сейчас, единственный способ, которым я могу думать об этом, - сохранить весь исходный текст страницы в виде текстового файла (что я и сделал), а затем проанализировать его самостоятельно, выполнив поиск каждого экземпляра используемых инструментов визуализации Google и продолжая оттуда). Это было бы довольно утомительно и, вероятно, не очень надежно при попытке использовать его для другой ссылки.

Заранее большое спасибо за любые предложения.

Answer 1

Функция getChartData2 () визуализирует визуализацию диаграммы в виде SVG на странице. Таким образом, диаграмма поддерживает интерактивные возможности, которые вы видите при наведении курсора на диаграмму. Вы можете попробовать извлечь этот SVG из DOM и сохранить его как SVG, чтобы увидеть, сохранит ли он график без интерактивности. Или вы можете попробовать сохранить его в формате PNG. Не уверен в лучшем подходе.

Могу ли я спросить, что вы пытаетесь достичь sh? Возможно, будет проще собрать данные из таблиц, а затем использовать их для создания собственных диаграмм и таблиц на вашей платформе. Вы даже можете использовать те же инструменты визуализации Google.

И еще один вариант, Tiin go - это платформа данных фондового рынка, имеющая API с действительно хорошими уровнями бесплатного доступа. Вместо извлечения из PV вы можете напрямую интегрироваться с API Tiin go для извлечения нужных вам данных.

Надеюсь, это поможет!

Обновлено на основе приведенного выше комментария Cimerra:

Да, извлечение данных из текста getChartData2 () будет затруднительным. У вас есть доступ к выполнению любого из JavaScript на странице через ваш фреймворк? Когда я открываю Chrome Инструменты разработчика для этой страницы, я могу вызвать getChartData2 (), и возвращаются три объекта. Второй объект - это объект data2, которым вы теоретически можете манипулировать, чтобы получить из него то, что вы хотите.

Tf: Array(6)
  0:
    c: Array(4)
      0: {v: "2015"}
      1: {v: 0.02622989191078684, f: "2.62%"}
      2: {v: 0.027694140180976934, f: "2.77%"}
      3: {v: 0.020218079771240793, f: "2.02%"}

Если вы все еще не можете этого сделать, я бы предложил найти источник данных ( например, Tiin go (бесплатно) или данные CSI (платные, но это то, что использует PV), а затем выполнение собственных расчетов для того, что вам нужно. Дополнительным преимуществом является то, что вы на самом деле погружаетесь в финансовый мир и узнаете, как все эти вещи рассчитываются.

Конечно, это становится довольно сложным делом, и в конечном итоге вы восстанавливаете многое из того, что предоставляет вам PV. , Я перестроил небольшую часть PV в Google Sheets + Tiin go, но в итоге это был хрупкий беспорядок. PV только недавно внедрил модель подписки, и я подписался, потому что это потрясающий сайт с потрясающими данными, и я не хочу тратить все свое время на его воссоздание.