plotly / plotly/plotly.py

problem getting MathJax to work (need more documentation)

Ouverte
#4,551 0 commentaires 0 réactions 1 personne assignée Voir sur GitHub

@Coding-with-Adam y travaille déjà.

Depuis le 11/7/2024.

documentation feature P3
Langage dominant
Python
Étoiles
18.8k
Forks
2.8k
Merge moyen
16 h 26 min
PR mergées (30 j)
21

Description

I would like to ask where I can read more abour the mathjax support/integration for latex typesetting with plotly (python + js). I'm working a proof of concept web app with django framework (backend) and bootstrap (frontent). My wish is to be able to use latex typesetting also in bootstrap components and I was thinking about using just a single library to support it, e.g. mathjax.

To date I create plotly plots and convert them with io.to_html to integrate them into the template\html of django, for instance a small example:

def index(request):
    # Using graph_objects
    df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv')
    # Create the Layout object
    light_layout = Layout(
        xaxis_title=r'$\text{Datetime }[\text{YYYY MMM}]$',
        #yaxis_title="Y Axis Label",
        yaxis_title=r'$\text{Prices }[\unicode{x20AC}]$',
        plot_bgcolor='white',
        paper_bgcolor='white',
        xaxis=dict(
            linecolor='black',
            tickformat="%Y %b",
            tickfont=dict(
                color='black'
            ),
            titlefont=dict(
                color='black'
            )
        ),
        yaxis=dict(
            linecolor='black',
            tickfont=dict(
                color='black'
            ),
            titlefont=dict(
                color='black'
            )
        )
    )

    fig = go.Figure(
        [
            go.Scatter(
                x=df['Date'],
                y=df['AAPL.High'],
                line=dict(color='blue'),
            )
        ],
        layout=light_layout,
    )

    plot = pio.to_html(
        fig,
        full_html=False,
        include_plotlyjs='cdn',
        include_mathjax='cdn',
    )
    context = {
        'include_plotly': False,
        'include_mathjax': False,
        'plot' : plot,
    }
    return render(request, "test/index.html", context)

I have tried, unsuccesfully to change the arguments of pio.to_html in order not to pass CDNs script links but to load them directly with a custom logic into the template/html so that I can load mathjax when I use plotly with latex typesetting or when I just put some latex typesetting without plotly:

    ...
    plot = pio.to_html(
        fig,
        full_html=False,
        include_plotlyjs=False,
        include_mathjax=False,
    )

For example, using a syntax similar to jinja2 I can add/load frontent variables/scripts from the backend logic as follows:

{% extends "base.html" %}
{% block head %}
    {% if include_plotly %}
        <script async src="https://cdn.plot.ly/plotly-latest.min.js"></script>
    {% endif %}
    {% if include_mathjax %}
        <!-- Plotly requires MathJax 2.7.5 -->
        <script async src="https://cdn.jsdelivr.net/npm/mathjax@2.7.5/es5/tex-mml-chtml.js"></script>
    {% endif %}
{% endblock %}

{% block content %}
{{ plot|safe }}
{% endblock %}

From the developer console I can see that plotly.js and mathjax.js scripts are loaded into the html, but the plot does not show. What can I do to fix it? Also what is the right/latext version of mathjax supported with plotly python and js?

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.