{"id":455220,"date":"2025-04-09T03:00:10","date_gmt":"2025-04-09T03:00:10","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=455220"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=455220","title":{"rendered":"\u0422\u0440\u0438 \u0440\u0430\u0437\u043d\u044b\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043d\u0430 \u043e\u0434\u043d\u043e\u043c \u0433\u0440\u0430\u0444\u0438\u043a\u0435 \u0441 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u043e\u0439 Plotly<\/span>"},"content":{"rendered":"
<\/div>\n
\n
\n
\n
\n

\u0411\u0443\u0434\u0443\u0447\u0438 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0446\u0435\u0439 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u0438\u0437\u043c\u0430 \u0432\u043e \u0432\u0441\u0435\u043c, \u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 \u0438 \u0432 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0430\u043d\u043d\u044b\u0445, \u044f \u0438\u0437\u0431\u0435\u0433\u0430\u044e \u043f\u043e\u043f\u044b\u0442\u043e\u043a «\u0432\u043f\u0438\u0445\u043d\u0443\u0442\u044c \u043d\u0435\u0432\u043f\u0438\u0445\u0443\u0435\u043c\u043e\u0435» \u0432 \u043e\u0434\u043d\u0443 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e. \u041b\u0443\u0447\u0448\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u044e \u0433\u0440\u0443\u043f\u043f\u0443 \u0433\u0440\u0430\u0444\u0438\u043a\u043e\u0432. \u041d\u043e \u0438\u043d\u043e\u0433\u0434\u0430 \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442\u0441\u044f \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0432\u0438\u0437\u0443\u0430\u043b \u0438 \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u0435\u0433\u043e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0441\u0442\u0438. <\/p>\n

\u042d\u0442\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043e\u0434\u043d\u0430 \u0438\u0437 \u043d\u0438\u0445. \u041d\u043e \u0437\u0430\u0438\u043d\u0442\u0440\u0438\u0433\u043e\u0432\u0430\u043b \u043c\u0435\u043d\u044f \u0434\u0430\u0436\u0435 \u043d\u0435 \u0441\u0430\u043c \u0434\u0438\u0437\u0430\u0439\u043d, \u0430 \u0442\u0435\u043a\u0441\u0442 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u0438\u0437 \u0422\u0413\u041a Power BI Design: «\u0422\u0440\u0438 \u0440\u0430\u0437\u043d\u044b\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043d\u0430 \u043e\u0434\u043d\u043e\u043c \u0433\u0440\u0430\u0444\u0438\u043a\u0435. \u041a\u0430\u043a? \u041d\u0435\u043f\u0440\u043e\u0441\u0442\u043e». \u0418 \u044f \u043f\u043e\u0434\u0443\u043c\u0430\u043b\u0430: \u0430 \u043a\u0430\u043a \u044d\u0442\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430 python \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c plotly?<\/p>\n

\"\u0420\u0435\u0444\u0435\u0440\u0435\u043d\u0441,<\/p>\n
\u0420\u0435\u0444\u0435\u0440\u0435\u043d\u0441, \u0432\u0437\u044f\u0442\u043e \u0438\u0437 \u0422\u0413\u041a Power BI Design<\/figcaption><\/div>\n<\/figure>\n
\n\u0421\u043a\u0440\u044b\u0442\u044b\u0439 \u0442\u0435\u043a\u0441\u0442<\/summary>\n
\n

\u0424\u0438\u043d\u0430\u043b \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u043e\u0439, \u0435\u0441\u043b\u0438 \u0432\u0434\u0440\u0443\u0433 \u043d\u0435\u0442 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0447\u0438\u0442\u0430\u0442\u044c \u0441 \u043d\u0430\u0447\u0430\u043b\u0430 \u0438 \u0434\u043e \u043a\u043e\u043d\u0446\u0430) \u041f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u0434 \u0432 \u043a\u043e\u043d\u0446\u0435<\/p>\n

<\/figure>\n<\/p>\n<\/div>\n<\/details>\n

\u041f\u0435\u0440\u0432\u043e\u0435, \u0447\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c, \u044d\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043d\u0430\u0431\u043e\u0440 \u0434\u0430\u043d\u043d\u044b\u0445.<\/p>\n

import numpy as np revenue_fact = np.random.randint(50000000, 100000000, size=12).tolist() #\u0432\u044b\u0440\u0443\u0447\u043a\u0430 SKU_count = np.random.randint(80, 150, size=12).tolist() #\u043a\u043e\u043b-\u0432\u043e SKU quarters_1 = pd.date_range('2022Q1', periods=12, freq='Q') quarters = quarters_1.to_period('Q').astype(str) #\u043f\u0435\u0440\u0438\u043e\u0434\u044b - \u043a\u0432\u0430\u0440\u0442\u0430\u043b\u044b gross_margin = np.random.randint(15, 22, size=12).tolist() #\u0432\u0430\u043b\u043e\u0432\u0430\u044f \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c #\u0441\u043e\u0437\u0434\u0430\u044e \u0444\u0440\u0435\u0439\u043c \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u043e\u043b\u0431\u0446\u044b df = pd.DataFrame({        'quarter': quarters,     'revenue': revenue_fact,     'SKU_count': SKU_count,      'percent': persent,      'gross_margin': gross_margin}) df['revenue_mln'] = round(df['revenue']\/1000000,2) df['gross_profit_margin'] = round(df['revenue'] * (df['gross_margin']\/100),2) df['gross_profit_margin_mln'] = round(df['gross_profit_margin']\/1000000,2)<\/code><\/pre>\n
\u0414\u0430\u043b\u0435\u0435 \u044f \u043e\u0431\u044a\u044f\u0441\u043d\u044e, \u0437\u0430\u0447\u0435\u043c \u044f \u0441\u043e\u0437\u0434\u0430\u044e \u0441\u0442\u043e\u043b\u0431\u0446\u044b \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u043e \u0432\u044b\u0440\u0443\u0447\u043a\u0435 \u0438 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0431\u044b\u043b\u0438 \u0432 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u0430\u0445 \u0440\u0443\u0431\u043b\u0435\u0439.<\/p>\n
\u041e\u0431\u0449\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0430<\/h3>\n
\u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u043d\u0443\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442 \u0441 \u0434\u0432\u0443\u043c\u044f \u043e\u0441\u044f\u043c\u0438 Y: \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 (\u043b\u0435\u0432\u0430\u044f) \u0438 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f\/\u0432\u0442\u043e\u0440\u0438\u0447\u043d\u0430\u044f (\u043f\u0440\u0430\u0432\u0430\u044f), \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u044f \u0438 \u0431\u0443\u0434\u0443 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043c\u043e\u0438 \u0433\u0440\u0430\u0444\u0438\u043a\u0438. <\/p>\n
# \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u0441 \u043f\u043e\u0434\u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0434\u0432\u0435 \u043e\u0441\u0438 Y fig = make_subplots(specs=[[{'secondary_y': True}]]) # \u0412 \u043e\u0441\u044c X \u043a\u043b\u0430\u0434\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u0435\u0440\u0438\u043e\u0434\u043e\u0432 # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u043f\u0435\u0440\u0432\u044b\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0434\u0438\u043d\u0430\u043c\u0438\u043a\u0443 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u0430 \u043f\u0440\u043e\u0434\u0430\u043d\u043d\u044b\u0445 SCU # secondary_y = True \u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442 \u0433\u0440\u0430\u0444\u0438\u043a \u043a\u043e \u0432\u0442\u043e\u0440\u043e\u0439 \u043e\u0441\u0438 Y fig.add_trace(go.Scatter(x=df['quarter'],                           y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text'),               secondary_y = True)  # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0432\u0442\u043e\u0440\u043e\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u044b\u0440\u0443\u0447\u043a\u0438 fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430'),                secondary_y = False)  # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0442\u0440\u0435\u0442\u0438\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0431\u044b\u043b\u0438 fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c'),                secondary_y = False)  # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0447\u0435\u0442\u0432\u0435\u0440\u0442\u044b\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 fig.add_trace(go.Scatter(x=df['quarter'], y=df['gross_margin'],                           name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           mode='lines',                           fill='tozeroy'),                secondary_y = True)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'), #title_x=0.1, title_y=0.95,                   #title_font=dict(size=16, color=dark_3, weight='bold'),                    height = 350, width = 650), fig.show()<\/code><\/pre>\n
\"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/p>\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n
\u0412\u043e\u0442 \u0442\u0430\u043a\u043e\u0439 \u043d\u0435\u043a\u0430\u0437\u0438\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 \u0433\u0440\u0430\u0444\u0438\u043a \u043c\u0435\u043d\u044f \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0441\u044f: \u043c\u0435\u0436\u0434\u0443 \u0433\u0440\u0430\u0444\u0438\u043a\u0430\u043c\u0438, \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044e\u0449\u0438\u043c\u0438 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e SKU \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0443\u0436 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u0441\u0435\u0442\u043a\u0438 \u043e\u0431\u0435\u0438\u0445 \u043e\u0441\u0435\u0439 Y \u0441\u043e\u0437\u0434\u0430\u044e\u0442 \u043d\u0435\u0440\u0430\u0437\u0431\u0435\u0440\u0438\u0445\u0443 \u0438 \u0434\u0435\u043b\u0430\u044e\u0442 \u0433\u0440\u0430\u0444\u0438\u043a \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e \u043d\u0435\u0447\u0438\u0442\u0430\u0435\u043c\u044b\u043c. \u0418 \u043e\u0445 \u0443\u0436 \u044d\u0442\u0438 \u0446\u0432\u0435\u0442\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e… \u041c\u043e\u0436\u043d\u043e \u0438 \u043d\u0435 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u044f\u0442\u044c \u0432\u0441\u0435 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438: \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u043b\u043e\u0445\u0430 \u0438 \u0442\u043e\u0447\u043a\u0430 \u0438  \u044d\u0442\u043e \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e<\/p>\n
\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0435<\/h2>\n
\u042f \u043f\u043b\u0430\u043d\u0438\u0440\u0443\u044e \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u043b\u0435\u0433\u0435\u043d\u0434\u0443 \u0432 \u0432\u0435\u0440\u0445\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e, \u043a\u0430\u043a \u043d\u0430 \u043c\u043e\u0435\u043c \u0440\u0435\u0444\u0435\u0440\u0435\u043d\u0441\u0435, \u0437\u0430\u0434\u0430\u043c \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 \u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u044e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432, \u043e\u0442\u043a\u043b\u044e\u0447\u0443 \u0441\u0435\u0442\u043a\u0443 \u0434\u043b\u044f \u043f\u0440\u0430\u0432\u043e\u0439 \u043e\u0441\u0438 Y. \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a:<\/p>\n
fig = make_subplots(specs=[[{'secondary_y': True}]])  fig.add_trace(go.Scatter(x=df['quarter'],                           y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text'),               secondary_y = True)  fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430'),                secondary_y = False)  fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c'),                secondary_y = False)  fig.add_trace(go.Scatter(x=df['quarter'], y=df['gross_margin'],                           name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           mode='lines',                           fill='tozeroy'),                secondary_y = True)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'),                    title_x=0.1, title_y=0.95, #\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430                   height = 350, width = 650,                    yaxis2=dict(showticklabels=False, showgrid=False), #\u043e\u0442\u043a\u043b\u044e\u0447\u0430\u044e \u0441\u0435\u0442\u043a\u0443 \u0438 \u0442\u0438\u043a\u0438 \u0434\u043b\u044f \u0432\u0442\u043e\u0440\u043e\u0439 (\u043f\u0440\u0430\u0432\u043e\u0439) \u043e\u0441\u0438 Y                    legend_font=dict(size=11), # \u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e \u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0440\u0438\u0444\u0442\u0430 \u0434\u043b\u044f \u043b\u0435\u0433\u0435\u043d\u0434\u044b, \u0447\u0442\u043e\u0431\u044b \u0437\u0430\u043c\u043e\u0441\u0442\u0438\u0442\u044c \u0432\u0441\u0435 \u043e\u0431\u043e\u0437\u043d\u0430\u0447\u0435\u043d\u0440\u0438\u044f \u0432 \u043e\u0434\u0438\u043d \u0440\u044f\u0434                    #\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044e \u043b\u0435\u0433\u0435\u043d\u0434\u044b \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439 \u0444\u043e\u043d \u0434\u043b\u044f \u043b\u0435\u0433\u0435\u043d\u0434\u0430                   legend=dict(orientation=\"h\", yanchor=\"bottom\", y=0.9, xanchor=\"left\", x=0.02, bgcolor='rgba(255, 255, 255, 0)'),                   #\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e \u0440\u0435\u0436\u0438\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0441\u0442\u043e\u043b\u0431\u0446\u043e\u0432: \u0441\u0442\u043e\u043b\u0431\u0446\u044b \u0431\u0443\u0434\u0443\u0442 \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430                                     barmode='overlay',                   # \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0444\u0438\u0433y\u0440\u044b                   margin = dict(t=50, l=50, r=10, b=10)) fig.show()<\/code><\/pre>\n
\u0410 \u044d\u0442\u043e \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0435\u0433\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f. <\/p>\n
\"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/p>\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n
\u041f\u043e \u043c\u043e\u0435\u043c\u0443 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0443\u0436\u0435 \u043f\u0440\u0438\u043b\u0438\u0447\u043d\u0435\u0435. \u041d\u043e \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u0435\u0449\u0435 \u043e\u0447\u0435\u043d\u044c \u043c\u043d\u043e\u0433\u043e \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u043e\u0432: \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u044e\u0442 \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430 \u0438\u043b\u0438 \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442 \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438 \u043e\u0447\u0435\u043d\u044c \u043c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430, \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u043d\u0435\u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u044f \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u043d\u043e\u0441\u0442\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u0440\u0443\u0433 \u0434\u0440\u0443\u0433\u0443.
\u042f \u0431\u0443\u0434\u0443 \u0440\u0435\u0448\u0430\u0442\u044c \u044d\u0442\u0443 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443 \u043f\u0443\u0442\u0435\u043c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u043e\u0432 \u043e\u0441\u0435\u0439 Y. 
\u0427\u0442\u043e\u0431\u044b \u0441\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0433\u0440\u0430\u0444\u0438\u043a\u0438 \u0432\u043d\u0438\u0437 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0439 \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u043d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043b\u0435\u0433\u0435\u043d\u0434\u044b \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a, \u044f \u0443\u0432\u0435\u043b\u0438\u0447\u0443 \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043d\u0430 \u043e\u0441\u0438 Y. \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044e \u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0440\u0438\u0444\u0442\u0430 \u0442\u0438\u043a\u043e\u0432 \u043f\u043e \u043e\u0441\u044f\u043c Y \u0438 X. 
\u0427\u0442\u043e\u0431\u044b \u044d\u0442\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u044f \u0434\u043e\u0431\u0430\u0432\u043b\u044e \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0432 \u043c\u0435\u0442\u043e\u0434 update_layout.<\/p>\n
#\u043c\u0435\u043d\u044f\u044e \u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0440\u0438\u0444\u0442\u0430 \u0442\u0438\u043a\u043e\u0432, \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \"range\" \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u043f\u0440\u0435\u0434\u0435\u043b\u044b \u043e\u0441\u0435\u0439 xaxis=dict(tickfont_size=10), axis=dict(tickfont_size=10,            side='left', range=[0, df['revenue'].max() + 20000000]), yaxis2=dict(showticklabels=False, side='right', showgrid=False,              range=[df['SKU_count'].min()-20, df['SKU_count'].max() + 20])<\/code><\/pre>\n
\u041f\u043e\u0441\u043b\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u0431\u043b\u043e\u043a\u0430 \u043a\u043e\u0434\u0430, \u0433\u0440\u0430\u0444\u0438\u043a \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0432\u043e\u0442 \u0442\u0430\u043a:<\/p>\n
\"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/p>\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n
\u0423\u0443\u0443\u043f\u043f\u043f\u043f\u0441… \u0410 \u0433\u0434\u0435 Area Chart?<\/h3>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u043d\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0433\u0440\u0430\u0444\u0438\u043a, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0449\u0438\u0439 \u0434\u0438\u043d\u0430\u043c\u0438\u043a\u0443 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438.
 \u042d\u0442\u043e \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u043e \u043f\u043e\u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u0430\u0432\u043e\u0439 \u043e\u0441\u0438 Y \u0441\u0442\u0430\u043b\u043e \u0431\u043e\u043b\u044c\u0448\u0435, \u0447\u0435\u043c \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0432 \u043c\u043e\u0435\u043c \u0440\u044f\u0434\u0443.
\u041d\u043e \u044d\u0442\u043e \u043d\u0435 \u043f\u043e\u0432\u043e\u0434 \u043e\u0442\u043a\u0430\u0442\u0438\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u043c\u043e\u044e \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u043b\u0443\u0447\u0448\u0435.<\/p>\n
\u0427\u0442\u043e\u0431\u044b \u0440\u0435\u0448\u0438\u0442\u044c \u044d\u0442\u0443 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443 \u044f \u0438\u0437\u043c\u0435\u043d\u044e \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u043d\u043e\u0441\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0445 \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e Area Chart (\u0413\u0440\u0430\u0444\u0438\u043a \u043f\u043b\u043e\u0449\u0430\u0434\u0435\u0439), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438. \u0418\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u0432 \u043e\u0441\u044c Y \u044f \u043f\u043e\u043b\u043e\u0436\u0438\u043b\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438\u0437 \u0441\u0442\u043e\u043b\u0431\u0446\u0430 df[‘gross_margin’]. \u0421\u0440\u0435\u0434\u043d\u0435\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0433\u043e \u0441\u0442\u043e\u043b\u0431\u0446\u0430 \u0432 ~6 \u0440\u0430\u0437 \u043c\u0435\u043d\u044c\u0448\u0435, \u0447\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0441\u0442\u043e\u043b\u0431\u0446\u0430 df[‘SKU_count’]. \u042f \u0441\u043e\u0437\u0434\u0430\u043c \u0441\u043f\u0438\u0441\u043e\u043a \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0433\u0440\u0430\u0444\u0438\u043a\u0430 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0435\u0439, \u043f\u0443\u0442\u0435\u043c \u0443\u0432\u0435\u043b\u0438\u0447\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u043d\u0430 n.<\/p>\n
\u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n
fig = make_subplots(specs=[[{'secondary_y': True}]])  fig.add_trace(go.Scatter(x=df['quarter'],                           y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text'),               secondary_y = True)  fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430'),                secondary_y = False)  fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c'),                secondary_y = False)  #\u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0433\u0440\u0430\u0444\u0438\u043a\u0430 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0435\u0439 #\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 n = 4.8 \u0432\u044b\u0431\u0440\u0430\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u044b\u043c \u043f\u043e\u0434\u0431\u043e\u0440\u043e\u043c;  #\u043c\u043d\u0435 \u043a\u0430\u0436\u0435\u0442\u0441\u044f, \u0447\u0442\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0430\u0438\u043b\u0443\u0447\u0448\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0446\u0438\u044e \u0433\u0440\u0430\u0444\u0438\u043a\u0430 gross_margin_line = [int(num * 4.8) for num in df['gross_margin'].tolist()] fig.add_trace(go.Scatter(x=df['quarter'], y=gross_margin_line, #\u041a\u043b\u0430\u0434\u0435\u043c \u0441\u043f\u0438\u0441\u043e\u043a gross_margin_line \u0432 Y                          name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           mode='lines',                           fill='tozeroy'),                secondary_y = True)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'),                    title_x=0.1, title_y=0.95,                   height = 350, width = 650,                    xaxis=dict(tickfont_size=10),                   yaxis=dict(tickfont_size=10,                               side='left', range=[0, df['revenue'].max() + 20000000]),                   yaxis2=dict(showticklabels=False, side='right',                               showgrid=False, range=[df['SKU_count'].min()-20, df['SKU_count'].max() + 20]),                   legend_font=dict(size=11),                    legend=dict(orientation=\"h\", yanchor=\"bottom\", y=0.9, xanchor=\"left\", x=0.02, bgcolor='rgba(255, 255, 255, 0)'),                   barmode='overlay',                   margin = dict(t=50, l=50, r=10, b=10)) fig.show()<\/code><\/pre>\n<\/p>\n
\"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/p>\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430; \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0435\u0439 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438<\/figcaption><\/div>\n<\/figure>\n
\u0412\u043d\u0435\u0448\u043d\u0438\u0439 \u0432\u0438\u0434 \u0441\u0442\u0430\u043b \u044f\u0432\u043d\u043e \u043b\u0443\u0447\u0448\u0435. \u041d\u043e \u0432\u043e\u0442 \u0447\u0442\u043e \u044f \u0438\u043c\u0435\u044e \u043d\u0430 \u0434\u0430\u043d\u043d\u043e\u043c \u044d\u0442\u0430\u043f\u0435: \u0442\u0435\u043f\u0435\u0440\u044c \u0432\u043e \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430\u0445 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0430 \u043d\u0435 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0435.<\/p>\n
\u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043c\u043d\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0438\u0435 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438 \u0434\u043b\u044f \u0433\u0440\u0430\u0444\u0438\u043a\u0430 Area Chart, \u044f \u0441\u0434\u0435\u043b\u0430\u044e \u044d\u0442\u043e \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u0433\u0440\u0430\u0444\u0438\u043a\u043e\u0432, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0442\u044c \u0435\u0434\u0438\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u0438\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u0418 \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0443\u0442 \u043c\u043d\u0435 \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u044f\u0442\u0441\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u0442\u043e\u043b\u0431\u0446\u044b \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u043e \u0432\u044b\u0440\u0443\u0447\u043a\u0435 \u0438 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0431\u044b\u043b\u0438 \u0432 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u0430\u0445 \u0440\u0443\u0431\u043b\u0435\u0439. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0431\u0443\u0434\u0443 \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 customdata \u0438 hovertemplate.<\/p>\n
fig = make_subplots(specs=[[{'secondary_y': True}]])  fig.add_trace(go.Scatter(x=df['quarter'], y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text',                           customdata = df['SKU_count'],                           hovertemplate='<b>%{x}<\/b><br>' + '\u041a\u043e\u043b-\u0432\u043e SKU: %{customdata:.0f}<extra><\/extra>',),               secondary_y = True)  fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430',                       customdata = df['revenue_mln'], #\u0441\u0442\u043e\u043b\u0431\u0435\u0446 \u0441 \u0432\u044b\u0440\u0443\u0447\u043a\u043e\u0439 \u0432 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u0430\u0445 \u0440\u0443\u0431.                      hovertemplate='<b>%{x}<\/b><br>' + '\u0412\u044b\u0440\u0443\u0447\u043a\u0430: %{customdata:.2f} \u043c\u043b\u043d.\u0440\u0443\u0431.<extra><\/extra>'),                secondary_y = False)  fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c',                       customdata = df['gross_profit_margin_mln'], #\u0441\u0442\u043e\u043b\u0431\u0435\u0446 \u0441 \u0432\u0430\u043b. \u043f\u0440\u0438\u0431\u044b\u043b\u044c\u044e \u0432 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u0430\u0445 \u0440\u0443\u0431.                      hovertemplate='<b>%{x}<\/b><br>' + '\u0412\u0430\u043b.\u043f\u0440\u0438\u0431\u044b\u043b\u044c: %{customdata:.2f} \u043c\u043b\u043d.\u0440\u0443\u0431.<extra><\/extra>'),                secondary_y = False)  gross_margin_line = [int(num * 4.8) for num in df['gross_margin'].tolist()] fig.add_trace(go.Scatter(x=df['quarter'], y=gross_margin_line,                           name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           #\u0438\u043c\u0435\u043d\u043d\u043e \u044d\u0442\u043e\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \u043e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u0442\u043e, \u043a\u0430\u043a\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0431\u0443\u0434\u0443\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c\u0441\u044f \u0432\u043e \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430\u0445                          customdata=df['gross_margin'],                           hovertemplate='<b>%{x}<\/b><br>' + '\u041c\u0430\u0440\u0436\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c: %{customdata:.2f}%<extra><\/extra>',                          mode='lines',                           fill='tozeroy'),                secondary_y = True)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'),                    title_x=0.1, title_y=0.95,                   height = 350, width = 650,                    xaxis=dict(tickfont_size=10),                   yaxis=dict(tickfont_size=10,                               side='left', range=[0, df['revenue'].max() + 20000000]),                   yaxis2=dict(showticklabels=False, side='right',                               showgrid=False, range=[df['SKU_count'].min()-20, df['SKU_count'].max() + 20]),                   legend_font=dict(size=11),                    legend=dict(orientation=\"h\", yanchor=\"bottom\", y=0.9, xanchor=\"left\", x=0.02, bgcolor='rgba(255, 255, 255, 0)'),                   barmode='overlay',                   margin = dict(t=50, l=50, r=10, b=10)) fig.show()<\/code><\/pre>\n
<\/figure>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0438\u0435 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e.<\/p>\n
\u041a\u0430\u0441\u0442\u043e\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438<\/h4>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u0441\u0430\u043c\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u043f\u0440\u0438\u0441\u0442\u0443\u043f\u0438\u0442\u044c \u043a \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u044e \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 \u043c\u043e\u0435\u0439 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0438 \u043f\u0440\u0438\u0431\u043b\u0438\u043b\u0438\u0437\u0438\u0442\u044c \u0435\u0435 \u043a \u0440\u0435\u0444\u0435\u0440\u0435\u043d\u0441\u0443. \u0420\u0430\u0437\u0443\u043c\u0435\u0435\u0442\u0441\u044f, \u044f \u043d\u0435 \u0441\u0442\u0430\u0432\u0438\u043b\u0430 \u0441\u0435\u0431\u0435 \u0446\u0435\u043b\u044c\u044e \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u043e\u0432\u0442\u043e\u0440\u0438\u0442\u044c \u0440\u0435\u0444\u0435\u0440\u0435\u043d\u0441 (\u0445\u043e\u0442\u044f \u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u043d\u044b\u0439 \u043a\u043e\u0434), \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u0441\u043e\u0432\u043f\u0430\u0434\u0435\u043d\u0438\u044f \u043d\u0435 \u0431\u0443\u0434\u0435\u0442: \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u043e\u043d\u0438 \u0431\u0443\u0434\u0443\u0442 \u0432\u0441\u0435-\u0436\u0435 \u043f\u043e-\u0440\u0430\u0437\u043d\u043e\u043c\u0443.
\u041c\u043d\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043f\u043b\u0430\u0432\u043d\u044b\u043c\u0438 \u043b\u0438\u043d\u0438\u0438 Line Chart \u0438 Area Chart, \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0434\u043b\u044f \u043d\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0446\u0432\u0435\u0442\u043e\u0432\u0443\u044e \u0441\u0445\u0435\u043c\u0443.
\u041f\u043e\u0435\u0445\u0430\u043b\u0438!<\/p>\n
\n
\"\u0420\u0435\u0444\u0435\u0440\u0435\u043d\u0441<\/p>\n
\u0420\u0435\u0444\u0435\u0440\u0435\u043d\u0441 \u0446\u0432\u0435\u0442\u043e\u0432\u043e\u0439 \u0441\u0445\u0435\u043c\u044b. \u041d\u0430\u0439\u0434\u0435\u043d\u043e \u0432 Pinterest<\/figcaption><\/div>\n<\/figure>\n
\u041d\u0430\u0447\u043d\u0435\u043c \u0441 \u0446\u0432\u0435\u0442\u043e\u0432\u043e\u0439 \u0441\u0445\u0435\u043c\u044b. \u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0440\u0435\u0444\u0435\u0440\u0435\u043d\u0441\u0430 \u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u0438\u0434\u0435\u044e \u0438\u0437 Pinterest. 
\u0414\u0430-\u0434\u0430))) \u0426\u0432\u0435\u0442\u043e\u0432\u0430\u044f \u043f\u0430\u043b\u0438\u0442\u0440\u0430 \u043e\u0447\u0435\u043d\u044c \u0434\u0435\u0432\u0447\u0430\u0447\u044c\u044f. \u041d\u043e \u044f \u0434\u0435\u0432\u043e\u0447\u043a\u0430, \u0430 \u0437\u0430 \u043e\u043a\u043d\u043e\u043c \u0432\u0435\u0441\u043d\u0430. 
\u042f \u0437\u0430\u0434\u0430\u043c \u0446\u0432\u0435\u0442\u043e\u0432\u0443\u044e \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0438\u0437 \u0448\u0435\u0441\u0442\u0438 \u0446\u0432\u0435\u0442\u043e\u0432 \u043f\u0443\u0442\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e \u043f\u0440\u0438\u0441\u0432\u0430\u0438\u0432\u0430\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445, \u0433\u0434\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0431\u0443\u0434\u0435\u0442 Hex Color Code \u043d\u0443\u0436\u043d\u043e\u0433\u043e \u043c\u043d\u0435 \u0446\u0432\u0435\u0442\u0430. <\/p>\n
\u0427\u0442\u043e \u044f \u0441\u0434\u0435\u043b\u0430\u044e:
— \u043d\u0430\u0441\u0442\u0440\u043e\u044e \u0441\u0433\u043b\u0430\u0436\u0438\u0432\u0430\u043d\u0438\u0435\u00a0\u043b\u0438\u043d\u0438\u0439 Line Chart \u0438 Area Chart, \u0434\u043e\u0431\u0430\u0432\u043b\u044e \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u044e \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0439 \u0432\u0438\u0437\u0443\u0430\u043b \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u043e\u0434\u00a0\u0433\u0440\u0430\u0444\u0438\u043a\u043e\u043c Area Chart;
— \u0437\u0430\u0434\u0430\u043c \u0446\u0432\u0435\u0442\u0430 \u0434\u043b\u044f\u00a0\u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0438\u0437\u00a0\u0433\u0440\u0430\u0444\u0438\u043a\u043e\u0432, \u0430\u00a0\u0442\u0430\u043a\u0436\u0435 \u0434\u043b\u044f\u00a0\u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430, \u0448\u0440\u0438\u0444\u0442\u043e\u0432 \u043b\u0435\u0433\u0435\u043d\u0434\u044b \u0438 \u0442\u0438\u043a\u043e\u0432, \u0444\u043e\u043d\u0430;
— \u0437\u0430\u0434\u0430\u043c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0441\u0435\u0442\u043a\u0438 \u043e\u0441\u0435\u0439 Y;
— \u043d\u0430\u0441\u0442\u0440\u043e\u044e \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043c\u0435\u0436\u0434\u0443 \u0441\u0442\u043e\u043b\u0431\u0446\u0430\u043c\u0438 Bar Chart.<\/p>\n<\/div>\n
fig = make_subplots(specs=[[{'secondary_y': True}]])  #\u0417\u0430\u0434\u0430\u044e \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0445\u0440\u0430\u043d\u044f\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e Hex Color Code \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0446\u0432\u0435\u0442\u043e\u0432. dark_1 = '#c46d86' light_1 = '#eab0bb' light_2 = '#f5f5f5' dark_2 = '#6c6c6c' dark_3 = '#26601c' light_3 = '#31a422' fig.add_trace(go.Scatter(x=df['quarter'], y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text',                           customdata = df['SKU_count'],                           hovertemplate='<b>%{x}<\/b><br>' + '\u041a\u043e\u043b-\u0432\u043e SKU: %{customdata:.0f}<extra><\/extra>',                          marker_color=light_3, #\u0437\u0430\u0434\u0430\u044e \u0446\u0432\u0435\u0442 \u043b\u0438\u043d\u0438\u0438                          line=dict(shape='spline', #\u0441\u0433\u043b\u0430\u0436\u0438\u0432\u0430\u043d\u0438\u0435 \u043b\u0438\u043d\u0438\u0438                                    smoothing=0.9, # \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e \u0441\u0442\u0435\u043f\u0435\u043d\u044c \u0441\u0433\u043b\u0430\u0436\u0438\u0432\u0430\u043d\u0438\u044f)                                    color = light_3), #\u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e \u0446\u0432\u0435\u0442 \u043c\u0430\u0440\u043a\u0435\u0440\u0430                          text = df['SKU_count'].tolist(), #\u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0449\u0438\u0435\u0441\u044f \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f                          textposition='top center', #\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u044d\u0442\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439                          textfont=dict(size=9, color=dark_3, weight='bold')),#\u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0440\u0438\u0444\u0442\u0430, \u0435\u0433\u043e \u0436\u0438\u0440\u043d\u043e\u0441\u0442\u044c \u0438 \u0446\u0432\u0435\u0442                secondary_y = True)  fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430',                       customdata = df['revenue_mln'],                       hovertemplate='<b>%{x}<\/b><br>' + '\u0412\u044b\u0440\u0443\u0447\u043a\u0430: %{customdata:.2f} \u043c\u043b\u043d.\u0440\u0443\u0431.<extra><\/extra>',                       marker_color=light_1), #\u0446\u0432\u0435\u0442 \u0441\u0442\u043e\u043b\u0431\u0446\u0430               secondary_y = False)  fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c',                       customdata = df['gross_profit_margin_mln'],                       hovertemplate='<b>%{x}<\/b><br>' + '\u0412\u0430\u043b.\u043f\u0440\u0438\u0431\u044b\u043b\u044c: %{customdata:.2f} \u043c\u043b\u043d.\u0440\u0443\u0431.<extra><\/extra>',                       marker_color=dark_1),  #\u0446\u0432\u0435\u0442 \u0441\u0442\u043e\u043b\u0431\u0446\u0430               secondary_y = False)  gross_margin_line = [int(num * 4.8) for num in df['gross_margin'].tolist()] fig.add_trace(go.Scatter(x=df['quarter'], y=gross_margin_line,                           name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           marker_color=dark_3, #\u0446\u0432\u0435\u0442 \u043b\u0438\u043d\u0438\u0438                           customdata=df['gross_margin'],                           hovertemplate='<b>%{x}<\/b><br>' + '\u041c\u0430\u0440\u0436\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c: %{customdata:.2f}%<extra><\/extra>',                          mode='lines+text+markers',                           fill='tozeroy',                          text=[f\"{val:.0f}%\" for val in df['gross_margin']], #\u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0449\u0438\u0435\u0441\u044f \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0441\u043e \u0437\u043d\u0430\u043a\u043e\u043c '%'                          textposition='top center', #\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u044d\u0442\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439                          textfont=dict(size=9, color=dark_3, weight='bold'),                          #\u044d\u0442\u0430 \u0447\u0430\u0441\u0442\u044c \u043a\u043e\u0434\u0430 \u043e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u043d\u0430\u0441\u0442\u0440\u043e\u043a\u0443 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u043e\u0434 \u0433\u0440\u0430\u0444\u0438\u043a\u043e\u043c                          fillpattern=dict(shape='\/',  # \u0442\u0438\u043f \u0448\u0442\u0440\u0438\u0445\u043e\u0432\u043a\u0438                                           fgcolor=dark_3,  # \u0446\u0432\u0435\u0442 \u043b\u0438\u043d\u0438\u0439 \u0448\u0442\u0440\u0438\u0445\u043e\u0432\u043a\u0438                                           bgcolor=\"rgba(255, 255, 255, 0)\"),  # \u0446\u0432\u0435\u0442 \u0444\u043e\u043d\u0430, \u044f \u0437\u0430\u0434\u0430\u044e \u0435\u0433\u043e \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c)                          line=dict(shape='spline', smoothing=0.6)), #\u044d\u0442\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0442 \u0437\u0430 \u0441\u0433\u0440\u0430\u0436\u0438\u0432\u0430\u043d\u0438\u0435 \u043b\u0438\u043d\u0438\u0439                secondary_y = True) #\u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 \u0441\u0435\u0442\u043a\u0438: \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e \u0446\u0432\u0435\u0442 \u0438 \u0442\u043e\u043b\u0449\u0438\u043d\u0443 \u043b\u0438\u043d\u0438\u0439, \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u0443\u0431\u0438\u0440\u0430\u044e \u0441\u0430\u043c\u0443 \u043e\u0441\u044c X: \u043e\u043d\u0430 \u0435\u0441\u0442\u044c, \u043d\u043e \u0435\u0435 \u043d\u0435 \u0432\u0438\u0434\u043d\u043e \u0437\u0430 \u0441\u0447\u0435\u0442 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0435\u0435 \u0446\u0432\u0435\u0442 \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u0435\u0442 \u0441 \u0444\u043e\u043d\u043e\u043c fig.update_yaxes(showgrid=True, gridwidth=1, gridcolor=dark_2, zerolinecolor=light_2)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'),                    title_font=dict(size=16, color=dark_3, weight='bold'), #\u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0448\u0440\u0438\u0444\u0442\u0430 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430                   title_x=0.1, title_y=0.95, height = 350, width = 650,                    xaxis=dict(tickfont_size=10, tickfont_color=dark_2), #\u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e \u0446\u0432\u0435\u0442\u0430 \u0442\u0438\u043a\u043e\u0432                   yaxis=dict(tickfont_size=10, tickfont_color=dark_2, #\u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e \u0446\u0432\u0435\u0442\u0430 \u0442\u0438\u043a\u043e\u0432                              side='left', range=[0, df['revenue'].max() + 20000000]),                   yaxis2=dict(showticklabels=False, side='right',                               showgrid=False, range=[df['SKU_count'].min()-20, df['SKU_count'].max() + 20]),                   legend_font=dict(size=11, color = dark_2), #\u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e \u0446\u0432\u0435\u0442 \u0442\u0435\u043a\u0441\u0442\u0430 \u043b\u0435\u0433\u0435\u043d\u0434\u044b                   legend=dict(orientation=\"h\", yanchor=\"bottom\", y=0.9, xanchor=\"left\", x=0.02, bgcolor='rgba(255, 255, 255, 0)'),                   barmode='overlay',                   margin = dict(t=50, l=50, r=10, b=10),                   bargroupgap=0.1, #\u0434\u043e\u0431\u0430\u0432\u043b\u044e \"\u0432\u043e\u0437\u0434\u0443\u0445\" \u043c\u0435\u0436\u0434\u0443 \u0441\u0442\u043e\u043b\u0431\u0446\u0430\u043c\u0438                   paper_bgcolor = light_2, plot_bgcolor=light_2) #\u0437\u0430\u0434\u0430\u043c \u0446\u0432\u0435\u0442 \u0444\u043e\u043d\u0430 fig.show()<\/code><\/pre>\n
\"\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/p>\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n
\u0413\u043e\u0442\u043e\u0432\u043e!  \u0427\u0435\u0441\u0442\u043d\u043e \u0433\u043e\u0432\u043e\u0440\u044f, \u043c\u043d\u0435 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435 \u043d\u0440\u0430\u0432\u0438\u0442\u0441\u044f \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0447\u0430\u0440\u0442\u043e\u0432 «\u041a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e SKU» \u0438 «\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c»: \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0435 \u043f\u0435\u0440\u0435\u0433\u0440\u0443\u0436\u0435\u043d\u043d\u043e\u0441\u0442\u0438. \u0421 \u0443\u0447\u0435\u0442\u043e\u043c \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u043d\u0430 Plotly \u0441\u043e\u0437\u0434\u0430\u044e\u0442\u0441\u044f \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u044c \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0432\u0441\u0435\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0435 \u0443\u0436\u0435 \u043d\u0435 \u043a\u0430\u0436\u0435\u0442\u0441\u044f \u0442\u0430\u043a\u043e\u0439 \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e\u0439. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u044f \u0431\u044b \u0432\u043d\u0435\u0441\u043b\u0430 \u0442\u0430\u043a\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u043a\u043e\u0434:<\/p>\n
#\u0443\u0434\u0430\u043b\u0438\u0442\u044c text=[f\"{val:.0f}%\" for val in df['gross_margin']],  textposition='top center', #\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u044d\u0442\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 textfont=dict(size=9, color=dark_3, weight='bold') #\u0437\u0430\u043c\u0435\u043d\u0438\u0442\u044c mode='lines+text+markers', \u043d\u0430 mode='lines'<\/code><\/pre>\n
\u0418 \u043f\u0440\u0438\u043d\u044f\u043b\u0430 \u043a\u0430\u043a \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0442\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442:<\/p>\n
\"\u0418\u0442\u043e\u0433\u043e\u0432\u044b\u0439<\/p>\n
\u0418\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438<\/figcaption><\/div>\n<\/figure>\n
\u041a\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0441 \u0412\u0430\u0448\u0435\u0439 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u043b\u0443\u0447\u0448\u0435: \u0441 \u043e\u0431\u0438\u043b\u0438\u0435\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u043c\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0438\u043b\u0438 \u043d\u0430\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u0438\u0441\u0442\u0438\u0447\u043d\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442?<\/p>\n<\/p>\n<\/div>\n<\/div>\n<\/div>\n
<\/div>\n

 \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438  https:\/\/habr.com\/ru\/articles\/898970\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
<\/div>\n
\n
\n
\n
\n
\u0411\u0443\u0434\u0443\u0447\u0438 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0446\u0435\u0439 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u0438\u0437\u043c\u0430 \u0432\u043e \u0432\u0441\u0435\u043c, \u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 \u0438 \u0432 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0430\u043d\u043d\u044b\u0445, \u044f \u0438\u0437\u0431\u0435\u0433\u0430\u044e \u043f\u043e\u043f\u044b\u0442\u043e\u043a «\u0432\u043f\u0438\u0445\u043d\u0443\u0442\u044c \u043d\u0435\u0432\u043f\u0438\u0445\u0443\u0435\u043c\u043e\u0435» \u0432 \u043e\u0434\u043d\u0443 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e. \u041b\u0443\u0447\u0448\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u044e \u0433\u0440\u0443\u043f\u043f\u0443 \u0433\u0440\u0430\u0444\u0438\u043a\u043e\u0432. \u041d\u043e \u0438\u043d\u043e\u0433\u0434\u0430 \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442\u0441\u044f \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u0432\u0438\u0437\u0443\u0430\u043b \u0438 \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u0435\u0433\u043e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0441\u0442\u0438. <\/p>\n
\u042d\u0442\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043e\u0434\u043d\u0430 \u0438\u0437 \u043d\u0438\u0445. \u041d\u043e \u0437\u0430\u0438\u043d\u0442\u0440\u0438\u0433\u043e\u0432\u0430\u043b \u043c\u0435\u043d\u044f \u0434\u0430\u0436\u0435 \u043d\u0435 \u0441\u0430\u043c \u0434\u0438\u0437\u0430\u0439\u043d, \u0430 \u0442\u0435\u043a\u0441\u0442 \u043f\u0443\u0431\u043b\u0438\u043a\u0430\u0446\u0438\u0438 \u0438\u0437 \u0422\u0413\u041a Power BI Design: «\u0422\u0440\u0438 \u0440\u0430\u0437\u043d\u044b\u0435 \u0435\u0434\u0438\u043d\u0438\u0446\u044b \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u044f \u043d\u0430 \u043e\u0434\u043d\u043e\u043c \u0433\u0440\u0430\u0444\u0438\u043a\u0435. \u041a\u0430\u043a? \u041d\u0435\u043f\u0440\u043e\u0441\u0442\u043e». \u0418 \u044f \u043f\u043e\u0434\u0443\u043c\u0430\u043b\u0430: \u0430 \u043a\u0430\u043a \u044d\u0442\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430 python  \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c plotly?<\/p>\n
\n
\u0420\u0435\u0444\u0435\u0440\u0435\u043d\u0441, \u0432\u0437\u044f\u0442\u043e \u0438\u0437 \u0422\u0413\u041a Power BI Design<\/figcaption><\/div>\n<\/figure>\n
\n\u0421\u043a\u0440\u044b\u0442\u044b\u0439 \u0442\u0435\u043a\u0441\u0442<\/summary>\n
\n
\u0424\u0438\u043d\u0430\u043b \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u043e\u0439, \u0435\u0441\u043b\u0438 \u0432\u0434\u0440\u0443\u0433 \u043d\u0435\u0442 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0447\u0438\u0442\u0430\u0442\u044c \u0441 \u043d\u0430\u0447\u0430\u043b\u0430 \u0438 \u0434\u043e \u043a\u043e\u043d\u0446\u0430) \u041f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u0434 \u0432 \u043a\u043e\u043d\u0446\u0435<\/p>\n
<\/figure>\n<\/p>\n<\/div>\n<\/details>\n
\u041f\u0435\u0440\u0432\u043e\u0435, \u0447\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c, \u044d\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043d\u0430\u0431\u043e\u0440 \u0434\u0430\u043d\u043d\u044b\u0445.<\/p>\n
import numpy as np revenue_fact = np.random.randint(50000000, 100000000, size=12).tolist() #\u0432\u044b\u0440\u0443\u0447\u043a\u0430 SKU_count = np.random.randint(80, 150, size=12).tolist() #\u043a\u043e\u043b-\u0432\u043e SKU quarters_1 = pd.date_range('2022Q1', periods=12, freq='Q') quarters = quarters_1.to_period('Q').astype(str) #\u043f\u0435\u0440\u0438\u043e\u0434\u044b - \u043a\u0432\u0430\u0440\u0442\u0430\u043b\u044b gross_margin = np.random.randint(15, 22, size=12).tolist() #\u0432\u0430\u043b\u043e\u0432\u0430\u044f \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c #\u0441\u043e\u0437\u0434\u0430\u044e \u0444\u0440\u0435\u0439\u043c \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u043e\u043b\u0431\u0446\u044b df = pd.DataFrame({        'quarter': quarters,     'revenue': revenue_fact,     'SKU_count': SKU_count,      'percent': persent,      'gross_margin': gross_margin}) df['revenue_mln'] = round(df['revenue']\/1000000,2) df['gross_profit_margin'] = round(df['revenue'] * (df['gross_margin']\/100),2) df['gross_profit_margin_mln'] = round(df['gross_profit_margin']\/1000000,2)<\/code><\/pre>\n
\u0414\u0430\u043b\u0435\u0435 \u044f \u043e\u0431\u044a\u044f\u0441\u043d\u044e, \u0437\u0430\u0447\u0435\u043c \u044f \u0441\u043e\u0437\u0434\u0430\u044e \u0441\u0442\u043e\u043b\u0431\u0446\u044b \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u043e \u0432\u044b\u0440\u0443\u0447\u043a\u0435 \u0438 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0431\u044b\u043b\u0438 \u0432 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u0430\u0445 \u0440\u0443\u0431\u043b\u0435\u0439.<\/p>\n
\u041e\u0431\u0449\u0430\u044f \u043b\u043e\u0433\u0438\u043a\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0430<\/h3>\n
\u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u043d\u0443\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442 \u0441 \u0434\u0432\u0443\u043c\u044f \u043e\u0441\u044f\u043c\u0438 Y: \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 (\u043b\u0435\u0432\u0430\u044f) \u0438 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f\/\u0432\u0442\u043e\u0440\u0438\u0447\u043d\u0430\u044f (\u043f\u0440\u0430\u0432\u0430\u044f), \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u044f \u0438 \u0431\u0443\u0434\u0443 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043c\u043e\u0438 \u0433\u0440\u0430\u0444\u0438\u043a\u0438. <\/p>\n
# \u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u0441 \u043f\u043e\u0434\u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0434\u0432\u0435 \u043e\u0441\u0438 Y fig = make_subplots(specs=[[{'secondary_y': True}]]) # \u0412 \u043e\u0441\u044c X \u043a\u043b\u0430\u0434\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u0435\u0440\u0438\u043e\u0434\u043e\u0432 # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u043f\u0435\u0440\u0432\u044b\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0434\u0438\u043d\u0430\u043c\u0438\u043a\u0443 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u0430 \u043f\u0440\u043e\u0434\u0430\u043d\u043d\u044b\u0445 SCU # secondary_y = True \u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442 \u0433\u0440\u0430\u0444\u0438\u043a \u043a\u043e \u0432\u0442\u043e\u0440\u043e\u0439 \u043e\u0441\u0438 Y fig.add_trace(go.Scatter(x=df['quarter'],                           y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text'),               secondary_y = True)  # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0432\u0442\u043e\u0440\u043e\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u044b\u0440\u0443\u0447\u043a\u0438 fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430'),                secondary_y = False)  # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0442\u0440\u0435\u0442\u0438\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0431\u044b\u043b\u0438 fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c'),                secondary_y = False)  # \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0447\u0435\u0442\u0432\u0435\u0440\u0442\u044b\u0439 \u0433\u0440\u0430\u0444\u0438\u043a: \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 fig.add_trace(go.Scatter(x=df['quarter'], y=df['gross_margin'],                           name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           mode='lines',                           fill='tozeroy'),                secondary_y = True)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'), #title_x=0.1, title_y=0.95,                   #title_font=dict(size=16, color=dark_3, weight='bold'),                    height = 350, width = 650), fig.show()<\/code><\/pre>\n
\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n
\u0412\u043e\u0442 \u0442\u0430\u043a\u043e\u0439 \u043d\u0435\u043a\u0430\u0437\u0438\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 \u0433\u0440\u0430\u0444\u0438\u043a \u043c\u0435\u043d\u044f \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0441\u044f: \u043c\u0435\u0436\u0434\u0443 \u0433\u0440\u0430\u0444\u0438\u043a\u0430\u043c\u0438, \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044e\u0449\u0438\u043c\u0438 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e SKU \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0443\u0436 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u0441\u0435\u0442\u043a\u0438 \u043e\u0431\u0435\u0438\u0445 \u043e\u0441\u0435\u0439 Y \u0441\u043e\u0437\u0434\u0430\u044e\u0442 \u043d\u0435\u0440\u0430\u0437\u0431\u0435\u0440\u0438\u0445\u0443 \u0438 \u0434\u0435\u043b\u0430\u044e\u0442 \u0433\u0440\u0430\u0444\u0438\u043a \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e \u043d\u0435\u0447\u0438\u0442\u0430\u0435\u043c\u044b\u043c. \u0418 \u043e\u0445 \u0443\u0436 \u044d\u0442\u0438 \u0446\u0432\u0435\u0442\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e… \u041c\u043e\u0436\u043d\u043e \u0438 \u043d\u0435 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u044f\u0442\u044c \u0432\u0441\u0435 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0438: \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u043b\u043e\u0445\u0430 \u0438 \u0442\u043e\u0447\u043a\u0430 \u0438  \u044d\u0442\u043e \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e<\/p>\n
\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0435<\/h2>\n
\u042f \u043f\u043b\u0430\u043d\u0438\u0440\u0443\u044e \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u043b\u0435\u0433\u0435\u043d\u0434\u0443 \u0432 \u0432\u0435\u0440\u0445\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e, \u043a\u0430\u043a \u043d\u0430 \u043c\u043e\u0435\u043c \u0440\u0435\u0444\u0435\u0440\u0435\u043d\u0441\u0435, \u0437\u0430\u0434\u0430\u043c \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 \u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u044e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432, \u043e\u0442\u043a\u043b\u044e\u0447\u0443 \u0441\u0435\u0442\u043a\u0443 \u0434\u043b\u044f \u043f\u0440\u0430\u0432\u043e\u0439 \u043e\u0441\u0438 Y. \u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a:<\/p>\n
fig = make_subplots(specs=[[{'secondary_y': True}]])  fig.add_trace(go.Scatter(x=df['quarter'],                           y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text'),               secondary_y = True)  fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430'),                secondary_y = False)  fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c'),                secondary_y = False)  fig.add_trace(go.Scatter(x=df['quarter'], y=df['gross_margin'],                           name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           mode='lines',                           fill='tozeroy'),                secondary_y = True)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'),                    title_x=0.1, title_y=0.95, #\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430                   height = 350, width = 650,                    yaxis2=dict(showticklabels=False, showgrid=False), #\u043e\u0442\u043a\u043b\u044e\u0447\u0430\u044e \u0441\u0435\u0442\u043a\u0443 \u0438 \u0442\u0438\u043a\u0438 \u0434\u043b\u044f \u0432\u0442\u043e\u0440\u043e\u0439 (\u043f\u0440\u0430\u0432\u043e\u0439) \u043e\u0441\u0438 Y                    legend_font=dict(size=11), # \u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e \u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0440\u0438\u0444\u0442\u0430 \u0434\u043b\u044f \u043b\u0435\u0433\u0435\u043d\u0434\u044b, \u0447\u0442\u043e\u0431\u044b \u0437\u0430\u043c\u043e\u0441\u0442\u0438\u0442\u044c \u0432\u0441\u0435 \u043e\u0431\u043e\u0437\u043d\u0430\u0447\u0435\u043d\u0440\u0438\u044f \u0432 \u043e\u0434\u0438\u043d \u0440\u044f\u0434                    #\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044e \u043b\u0435\u0433\u0435\u043d\u0434\u044b \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439 \u0444\u043e\u043d \u0434\u043b\u044f \u043b\u0435\u0433\u0435\u043d\u0434\u0430                   legend=dict(orientation=\"h\", yanchor=\"bottom\", y=0.9, xanchor=\"left\", x=0.02, bgcolor='rgba(255, 255, 255, 0)'),                   #\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e \u0440\u0435\u0436\u0438\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0441\u0442\u043e\u043b\u0431\u0446\u043e\u0432: \u0441\u0442\u043e\u043b\u0431\u0446\u044b \u0431\u0443\u0434\u0443\u0442 \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430                                     barmode='overlay',                   # \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0444\u0438\u0433y\u0440\u044b                   margin = dict(t=50, l=50, r=10, b=10)) fig.show()<\/code><\/pre>\n
\u0410 \u044d\u0442\u043e \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0435\u0433\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f. <\/p>\n
\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n
\u041f\u043e \u043c\u043e\u0435\u043c\u0443 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0443\u0436\u0435 \u043f\u0440\u0438\u043b\u0438\u0447\u043d\u0435\u0435. \u041d\u043e \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u0435\u0449\u0435 \u043e\u0447\u0435\u043d\u044c \u043c\u043d\u043e\u0433\u043e \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043a\u043e\u0432: \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u044e\u0442 \u0434\u0440\u0443\u0433 \u043d\u0430 \u0434\u0440\u0443\u0433\u0430 \u0438\u043b\u0438 \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442 \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438 \u043e\u0447\u0435\u043d\u044c \u043c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430, \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u043d\u0435\u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u044f \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u043d\u043e\u0441\u0442\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u0440\u0443\u0433 \u0434\u0440\u0443\u0433\u0443.
\u042f \u0431\u0443\u0434\u0443 \u0440\u0435\u0448\u0430\u0442\u044c \u044d\u0442\u0443 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443 \u043f\u0443\u0442\u0435\u043c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u043e\u0432 \u043e\u0441\u0435\u0439 Y. 
\u0427\u0442\u043e\u0431\u044b \u0441\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0433\u0440\u0430\u0444\u0438\u043a\u0438 \u0432\u043d\u0438\u0437 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u0435\u0440\u0445\u043d\u0435\u0439 \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u043d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043b\u0435\u0433\u0435\u043d\u0434\u044b \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a, \u044f \u0443\u0432\u0435\u043b\u0438\u0447\u0443 \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043d\u0430 \u043e\u0441\u0438 Y. \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044e \u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0440\u0438\u0444\u0442\u0430 \u0442\u0438\u043a\u043e\u0432 \u043f\u043e \u043e\u0441\u044f\u043c Y \u0438 X. 
\u0427\u0442\u043e\u0431\u044b \u044d\u0442\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u044f \u0434\u043e\u0431\u0430\u0432\u043b\u044e \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0432 \u043c\u0435\u0442\u043e\u0434 update_layout.<\/p>\n
#\u043c\u0435\u043d\u044f\u044e \u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0440\u0438\u0444\u0442\u0430 \u0442\u0438\u043a\u043e\u0432, \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \"range\" \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u043f\u0440\u0435\u0434\u0435\u043b\u044b \u043e\u0441\u0435\u0439 xaxis=dict(tickfont_size=10), axis=dict(tickfont_size=10,            side='left', range=[0, df['revenue'].max() + 20000000]), yaxis2=dict(showticklabels=False, side='right', showgrid=False,              range=[df['SKU_count'].min()-20, df['SKU_count'].max() + 20])<\/code><\/pre>\n
\u041f\u043e\u0441\u043b\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u0431\u043b\u043e\u043a\u0430 \u043a\u043e\u0434\u0430, \u0433\u0440\u0430\u0444\u0438\u043a \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0432\u043e\u0442 \u0442\u0430\u043a:<\/p>\n
\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430<\/figcaption><\/div>\n<\/figure>\n
\u0423\u0443\u0443\u043f\u043f\u043f\u043f\u0441… \u0410 \u0433\u0434\u0435 Area Chart?<\/h3>\n
\u0422\u0435\u043f\u0435\u0440\u044c \u043d\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0433\u0440\u0430\u0444\u0438\u043a, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0449\u0438\u0439 \u0434\u0438\u043d\u0430\u043c\u0438\u043a\u0443 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438.
 \u042d\u0442\u043e \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u043e \u043f\u043e\u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u0430\u0432\u043e\u0439 \u043e\u0441\u0438 Y \u0441\u0442\u0430\u043b\u043e \u0431\u043e\u043b\u044c\u0448\u0435, \u0447\u0435\u043c \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0432 \u043c\u043e\u0435\u043c \u0440\u044f\u0434\u0443.
\u041d\u043e \u044d\u0442\u043e \u043d\u0435 \u043f\u043e\u0432\u043e\u0434 \u043e\u0442\u043a\u0430\u0442\u0438\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u043c\u043e\u044e \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u043b\u0443\u0447\u0448\u0435.<\/p>\n
\u0427\u0442\u043e\u0431\u044b \u0440\u0435\u0448\u0438\u0442\u044c \u044d\u0442\u0443 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443 \u044f \u0438\u0437\u043c\u0435\u043d\u044e \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u043d\u043e\u0441\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0445 \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e Area Chart (\u0413\u0440\u0430\u0444\u0438\u043a \u043f\u043b\u043e\u0449\u0430\u0434\u0435\u0439), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438. \u0418\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u0432 \u043e\u0441\u044c Y \u044f \u043f\u043e\u043b\u043e\u0436\u0438\u043b\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438\u0437 \u0441\u0442\u043e\u043b\u0431\u0446\u0430 df[‘gross_margin’]. \u0421\u0440\u0435\u0434\u043d\u0435\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0433\u043e \u0441\u0442\u043e\u043b\u0431\u0446\u0430 \u0432 ~6 \u0440\u0430\u0437 \u043c\u0435\u043d\u044c\u0448\u0435, \u0447\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0441\u0442\u043e\u043b\u0431\u0446\u0430 df[‘SKU_count’]. \u042f \u0441\u043e\u0437\u0434\u0430\u043c \u0441\u043f\u0438\u0441\u043e\u043a \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0433\u0440\u0430\u0444\u0438\u043a\u0430 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0435\u0439, \u043f\u0443\u0442\u0435\u043c \u0443\u0432\u0435\u043b\u0438\u0447\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u043d\u0430 n.<\/p>\n
\u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n
fig = make_subplots(specs=[[{'secondary_y': True}]])  fig.add_trace(go.Scatter(x=df['quarter'],                           y=df['SKU_count'],                           name='\u041a\u043e\u043b-\u0432\u043e SKU',                           mode='lines+markers+text'),               secondary_y = True)  fig.add_trace(go.Bar(x=df['quarter'], y=df['revenue'],                       name='\u0412\u044b\u0440\u0443\u0447\u043a\u0430'),                secondary_y = False)  fig.add_trace(go.Bar(x=df['quarter'], y=df['gross_profit_margin'],                       name='\u0412\u0430\u043b\u043e\u0432\u0430\u044f \u043f\u0440\u0438\u0431\u044b\u043b\u044c'),                secondary_y = False)  #\u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0433\u0440\u0430\u0444\u0438\u043a\u0430 \u0440\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0435\u0439 #\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 n = 4.8 \u0432\u044b\u0431\u0440\u0430\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u044b\u043c \u043f\u043e\u0434\u0431\u043e\u0440\u043e\u043c;  #\u043c\u043d\u0435 \u043a\u0430\u0436\u0435\u0442\u0441\u044f, \u0447\u0442\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043d\u0430\u0438\u043b\u0443\u0447\u0448\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0446\u0438\u044e \u0433\u0440\u0430\u0444\u0438\u043a\u0430 gross_margin_line = [int(num * 4.8) for num in df['gross_margin'].tolist()] fig.add_trace(go.Scatter(x=df['quarter'], y=gross_margin_line, #\u041a\u043b\u0430\u0434\u0435\u043c \u0441\u043f\u0438\u0441\u043e\u043a gross_margin_line \u0432 Y                          name='\u0420\u0435\u043d\u0442\u0430\u0431\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c',                           mode='lines',                           fill='tozeroy'),                secondary_y = True)  fig.update_layout(title=(f'\u0421\u043a\u043e\u043b\u044c\u043a\u043e SKU \u043c\u044b \u043f\u0440\u043e\u0434\u0430\u0435\u043c \u0438 \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c'),                    title_x=0.1, title_y=0.95,                   height = 350, width = 650,                    xaxis=dict(tickfont_size=10),                   yaxis=dict(tickfont_size=10,                               side='left', range=[0, df['revenue'].max() + 20000000]),                   yaxis2=dict(showticklabels=False, side='right',                               showgrid=False, range=[df['SKU_count'].min()-20, df['SKU_count'].max() + 20]),                   legend_font=dict(size=11),                    legend=dict(orientation=\"h\", yanchor=\"bottom\", y=0.9, xanchor=\"left\", x=0.02, bgcolor='rgba(255, 255, 255, 0)'),                   barmode='overlay',                   margin = dict(t=50, l=50, r=10, b=10)) fig.show()<\/code><\/pre>\n<\/p>\n
\n
\u0420\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430; \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435 \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0435\u0439 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438<\/figcaption><\/div>\n<\/figure>\n
\u0412\u043d\u0435\u0448\u043d\u0438\u0439 \u0432\u0438\u0434 \u0441\u0442\u0430\u043b \u044f\u0432\u043d\u043e \u043b\u0443\u0447\u0448\u0435. \u041d\u043e \u0432\u043e\u0442 \u0447\u0442\u043e \u044f \u0438\u043c\u0435\u044e \u043d\u0430 \u0434\u0430\u043d\u043d\u043e\u043c \u044d\u0442\u0430\u043f\u0435: \u0442\u0435\u043f\u0435\u0440\u044c \u0432\u043e \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430\u0445 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0441\u0438\u043d\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0430 \u043d\u0435 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0435.<\/p>\n
\u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043c\u043d\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0438\u0435 \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0438 \u0434\u043b\u044f \u0433\u0440\u0430\u0444\u0438\u043a\u0430 Area Chart, \u044f \u0441\u0434\u0435\u043b\u0430\u044e \u044d\u0442\u043e \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u0433\u0440\u0430\u0444\u0438\u043a\u043e\u0432, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0442\u044c \u0435\u0434\u0438\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u0438\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u0418 \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0443\u0442 \u043c\u043d\u0435 \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u044f\u0442\u0441\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u0442\u043e\u043b\u0431\u0446\u044b \u0441 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u043e \u0432\u044b\u0440\u0443\u0447\u043a\u0435 \u0438 \u0432\u0430\u043b\u043e\u0432\u043e\u0439 \u043f\u0440\u0438\u0431\u044b\u043b\u0438 \u0432 \u043c\u0438\u043b\u043b\u0438\u043e\u043d\u0430\u0445 \u0440\u0443\u0431\u043b\u0435\u0439. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0431\u0443\u0434\u0443 \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 customdata \u0438 hovertemplate.<\/p>\n
fig = make_subplots(specs=[[{'secondary_y': True}]])  fig.add_trace(go.Scatter(x=df['quarter'], y=df['SKU_count'],<\/code><\/pre>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-455220","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/455220","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=455220"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/455220\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=455220"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=455220"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=455220"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}