any workaround to customize plotly multiple time series in python (updated)?

Question

I am trying to customize plotly iplot that rendered multiple time series, but iplot accept only one parameters. I checked into plotly documentation, and usinf go object was mentioned. But I am still not able able to adding custom fonts and watermark to the plotly plot. Can anyone help me out? any possible idea to make this work?

minimal data and demo code

Here is the code that I tried to use for adding custom fonts and watermark on that. I am new to plotly so some fancy built int functions are not quite intuitive to me. Any possible help would be appreciated.

from plotly.offline import download_plotlyjs, init_notebook_mode, plot, iplot
from IPython.core.display import display, HTML
import matplotlib as mpl
import cufflinks as cf
import seaborn as sns
import pandas as pd
import numpy as np

# setup
display(HTML("<style>.container { width:35% !important; } .widget-select > select {background-color: gainsboro;}</style>"))
init_notebook_mode(connected=True)
np.random.seed(1)
mpl.rcParams['figure.dpi']= 440

# sample data from cufflinks
df = cf.datagen.lines()

# plotly
iplot([{
    'x': df.index,
    'y': df[col],
    'name': col
}  for col in df.columns])

plus, I want to smooth the output of above code (which is multiple time series plot), how can I do that? any idea? Thanks

update

I have done this with matplotlib but don't know doing same thing in plotly. here is my script for loading customized font, watermark:

import matplotib.pyplot as plt
import matplotlib.font_manager as fm

fig, ax = plt.subplots(figsize=(10,6))

fname=r'C:\Users\Nunito-Black.ttf'
myfont=fm.FontProperties(fname=fname,size=50)
legend_fname=r'C:\Users\RobotoCondensed-Regular.ttf'
legend_font=fm.FontProperties(fname=legend_fname,size=20)
## some code for passing plot data to plotting function
ax.text(0.5, 0.5, 'mylogo',fontsize=60,fontproperties=myfont,color='black',
         transform=ax.transAxes,ha='center', va='center', alpha=0.3)

plt.show()

how can I do same things in plotly plot? any idea?

@rpanai I have custom font and watermark file in my local drive. I could include that by using `import matplotlib.font_manager as fm`, but seems plotly won't me do that. any idea? thanks — jyson, Jan 30 '20 at 22:19
@rpanai please see my updated script for loading and using custon fonts, water marks in `matplotlib`. any idea? — jyson, Jan 30 '20 at 22:41
Do you mind to produce a [mcve](/help/mcve)? I don't have `RobotoCondensed-Regular.ttf` so i can't reproduce — rpanai, Jan 30 '20 at 22:55
@rpanai I can share the file with you, can you open [this](https://jmp.sh/b/RyvLFeriXNRxaSKv572p) ? thanks — jyson, Jan 30 '20 at 22:59
@rpanai I am looking at plotly documentation but didn't figure out smoothing above plot because what I tried gave me an error. Plus I want to use custom fonts and watermark on it. your possible guidance would be appreciated. — jyson, Jan 31 '20 at 15:29
@rpanai my question was simple, like how to smooth plotly line chart [how to smoothing plot](https://stackoverflow.com/questions/20618804/how-to-smooth-a-curve-in-the-right-way). is that doable in plotly as well? any idea? — jyson, Feb 03 '20 at 14:59

score 1 · Accepted Answer · answered Feb 03 '20 at 11:51

Note: This is not (yet) an answer.

I do not understand what do you mean by smooth on the first part. Anyway I see some not necessary imports plus it seems to me you use plotly with an old sintax.

import plotly.graph_objs as go
import cufflinks as cf
import pandas as pd

df = cf.datagen.lines()

fig = go.Figure()
for col in df.columns:
    fig.add_trace(
        go.Scatter(x=df.index,
                   y=df[col],
                   name=col))

fig.show()

The output being

Consider that in this case you could use pd.util.testing.makeTimeDataFrame() instead of import cufflinks.

For the second part i suggest you to read the documentation for go.Layout.font? which is

   Supported dict properties:

        color

        family
            HTML font family - the typeface that will be
            applied by the web browser. The web browser
            will only be able to apply a font if it is
            available on the system which it operates.
            Provide multiple font families, separated by
            commas, to indicate the preference in which to
            apply fonts if they aren't available on the
            system. The plotly service (at https://plot.ly
            or on-premise) generates images on a server,
            where only a select number of fonts are
            installed and supported. These include "Arial",
            "Balto", "Courier New", "Droid Sans",, "Droid
            Serif", "Droid Sans Mono", "Gravitas One", "Old
            Standard TT", "Open Sans", "Overpass", "PT Sans
            Narrow", "Raleway", "Times New Roman".
        size

The usage in Python is here and apparently the js version is more flexible see this

any workaround to customize plotly multiple time series in python (updated)?

1 Answers1