Загрузка интерактивного графика Plotly одним нажатием кнопки в Django
Я работаю над проектом скринера акций, используя Django, Pandas и Plotly. Одна из страниц - это список часов пользователя, где для каждой акции отображается определенная статистика (одна строка HTML-таблицы для каждой акции). Эта HTML-таблица создается в представлении "watchlist" путем преобразования Pandas DataFrame в html с помощью метода "to_html" (с escape=False).
В каждой строке HTML-таблицы есть кнопка "Просмотр графика", которая открывает интерактивный график Plotly для соответствующей акции. График создается на основе результатов расчетов, выполненных в представлении "watchlist", и представлен html-строкой, которая отправляется в шаблон "watchlist" как часть контекста.
На данный момент я загружаю все графики акций под таблицей HTML каждый раз, когда загружается страница "watchlist", но первоначально графики остаются скрытыми с помощью css. Каждый график имеет идентификатор в наборе данных, который позволяет мне "снять" его с помощью JavaScript, когда кто-то нажимает на соответствующую кнопку с тем же идентификатором в таблице.
Однако, загрузка всех графиков сразу при загрузке страницы "watchlist" занимает много времени, и я пытаюсь придумать решение, которое ускорит этот процесс и будет оптимальным архитектурно. Количество акций (и соответствующих графиков) в списке просмотра пользователя может достигать 50-100.
Насколько я понимаю, потенциальными вариантами являются следующие:
create a "graph" template and view, and then use each "View graph" button to direct the user to the "graph" template that would display the relevant graph. However, I am not sure whether it is possible to pass a graph represented as an html string to the "graph" view.
create a separate HTML file for each graph at the point when calculations are being made in the "watchlist" view, then link each "View graph" button to the relevant HTML file. However, I am not sure where these HTML files need to go (especially after deployment) and how I could clean them up on a regular basis (as each graph would only be needed once).
load each graph on the "watchlist" page asynchronously when the matching "View graph" button gets clicked (as opposed to loading all the graphs at once when the page loads initially). I am using Vanilla JavaScript for the project's front end, and was wondering if this can be implemented without introducing React, JQuery etc.
Прошу прощения, если здесь есть очевидное решение, но я не слишком долго работал с Django, и был бы признателен за совет, как с этим справиться, прежде чем я спущусь в кроличью нору изучения новых инструментов, которые могут быть или не быть оптимальными для данного конкретного случая.
Большое спасибо!
Вы можете загрузить страницу списка часов без первоначальной загрузки графиков, а затем посылать запрос get для получения определенного графика всякий раз, когда пользователь нажимает на кнопку показа графика. Этого можно достичь с помощью htmx, и для django есть специальный пакет django-htmx. Прочитайте их документацию.