Usando la biblioteca React Plotly Js . Necesita una solución robusta en lugar de pasar plot_bgcolor y paper_bgcolor para crear un gráfico con un tema oscuro. No puedo encontrar documentos relacionados con la tematización para javascript.
Soy consciente de la creación de gráficos de Plotly con temas oscuros cambiando plot_bgcolor , paper_bgcolor y otros atributos internos.
Sin embargo, el resultado de este método no se ve tan bien como el gráfico producido con el tema oscuro predeterminado disponible en la versión de plotly python.
Según Plotly python doc , pasar el nombre del tema al objeto de la figura es suficiente para cambiar el tema.
import plotly.express as px df = px.data.gapminder() df_2007 = df.query("year==2007") for template in ["plotly", "plotly_white", "plotly_dark", "ggplot2", "seaborn", "simple_white", "none"]: fig = px.scatter(df_2007, x="gdpPercap", y="lifeExp", size="pop", color="continent", log_x=True, size_max=60, template=template, title="Gapminder 2007: '%s' theme" % template) fig.show() Según el documento anterior, la versión de Python se envía con temas incorporados ( 'ggplot2', 'seaborn', 'simple_white', 'plotly','plotly_white', 'plotly_dark', 'presentation', 'xgridoff','ygridoff', 'gridon' ).
Esperaba poder usar uno de estos temas ( plotly_dark ) dentro de mi sitio web.
Intenté buscar una característica similar en Plotly javascript. Lo más cercano que tengo es la plantilla de diseño de Javascript . Pero no se menciona el uso de temas incorporados.
Estoy buscando algo similar a la plantilla de tema de python, que puedo usar a través de la biblioteca React Plotly js.
Aquí está el enlace del blog Presentando plotly.py Theming discutiendo la función de temas para python, que salió en 2018.
Aquí está el enlace de github al archivo python que genera la plantilla de tema para plotly.py definitions.py
Aquí hay un enlace a codesandbox https://codesandbox.io/s/react-plotly-y9ifj9?file=/src/App.js que contiene el código de ejemplo disponible en el sitio web de react plotly.
Amablemente ayúdame señalándome en la dirección correcta
Esta es una buena pregunta. Al igual que usted, no pude encontrar ninguna referencia a los temas integrados en el código Javascript. Así que aquí está mi solución cruda para obtener el tema oscuro en Javascript:
El artículo del blog que mencionaste contiene un enlace a un cuaderno de ejemplo:
Si ejecuta este cuaderno, puede obtener los datos JSON del gráfico temático oscuro usando este código:
fig_plotly_dark = go.FigureWidget(fig) fig_plotly_dark.layout.template = 'plotly_dark' fig_plotly_dark.to_plotly_json()["layout"]["template"] (Es posible que deba reemplazar "True" de python con "true" para obtener un json válido). La plantilla extraída se puede usar en un gráfico Javascript/React Plotly asignándola a la propiedad layout.template .
Ver este jsFiddle: https://jsfiddle.net/3hfq7ast/