Расширенный артефакт визуализации Plotly играет с гистограммой

визуализация данных

Артефакт визуализации Plotly играет с гистограммами

Эта статья является пятой частью артефакта визуализации Plotly Drawing: основное внимание уделяется тому, как использовать Plotly для рисования.Гистограмма. Гистограмма — это диаграмма, которая очень часто появляется в диаграмме визуализации, может визуально отображать распределение данных по размерам, а также очень часто используется в моей собственной работе. В этой статье будет подробно описано, как сделатьГистограммаигоризонтальная гистограмма.

Первые 4 статьи о Plotly:

библиотека импорта

В первую очередь нам еще нужно импортировать несколько общих библиотек, которые нужны нам для рисования

import pandas as pd
import numpy as np

# 两种接口
import plotly_express as px
import plotly.graph_objects as go

При рисовании это все равно будет реализовано двумя способами:

  • plotly_express: пикс.
  • plotly.graph_objects: перейти

Столбчатая диаграмма на основе пикселей

Базовая гистограмма

Моделирование данных, необходимых для создания простого графика

df1 = pd.DataFrame({
    "name": ["小明","小红","周明","周红","张三"],
    "age": [20,28,18,25,36],
    "score": ["150","170","160","168","154"]
})

df1


fig = px.bar(df1,x="name",y="age")
fig.show()

Добавьте цвет параметра color:

fig = px.bar(df1,
             x="name",
             y="age",
             color="age"   # 颜色参数
            )
fig.show()

Сгруппированная столбчатая диаграмма на основе длинной таблицы

df2 = pd.DataFrame({
    "姓名": ["小明","小红","张三","小明","小红","张三","小明","小红","张三"],
    "科目":["语文","语文","语文","数学","数学","数学","英语","英语","英语"],
    "得分": [58,78,84,90,71,90,64,84,69]
})

df2


fig = px.bar(df2,
            x="姓名",
            y="得分",
            color="科目")
fig.show()

Сгруппированная столбчатая диаграмма на основе широкой таблицы

Широкая табличная форма в основном относится ко многим полям

df3 = pd.DataFrame({
    "姓名": ["小明","小红","张三"],
    "语文":[58,78,84],
    "数学":[90,71,90],
    "英语":[64,84,69]
})

df3


fig = px.bar(df3,
            x="姓名",
            y=["语文","数学","英语"],
            title="学生成绩对比"  # 添加标题
            )
fig.show()

Персонализация диаграммы

1. Измените цвет графика: добавьте параметр цвета

fig = px.bar(df1,
             x="name",
             y="age",
             color="age"  # 加上颜色参数
            )
fig.show()

Взгляните на пример чаевых в автономном наборе данных:

fig = px.bar(df4,
             x="sex",
             y="total_bill",
             color="smoker"   # 参数
            )

fig.show()

2. Задайте информацию о наведении графика: hover_data:

fig = px.bar(df1,
             x="name",
             y="age",
             color="age",  # 加上颜色参数
             hover_data = ['score']   # 悬停参数
            )
fig.show()

3, настройки наклона этикетки по оси X

information = pd.DataFrame({
    "days":["2021年3月1日 星期一",
            "2021年3月2日 星期二",
            "2021年3月3日 星期三",
            "2021年3月4日 星期四",
            ß"2021年3月5日 星期五"],
    "number":[400,700,300,500,800]
})

information

По умолчанию он отображается горизонтально:

fig = px.bar(information,x="days",y="number")
fig.show()   # 默认水平显示

Если мы добавим параметр width, то высота будет отображаться справа:

fig = px.bar(information,
             x="days",
             y="number",
             width=600,
             height=600)
fig.show()   # 参数width，height向右显示

плюсxaxis_tickangle, установите угол наклона:

fig = px.bar(information,x="days",y="number")
fig.update_layout(xaxis_tickangle=-45)   # 倾斜角度设置
fig.show()   # 结果是向左倾斜

даже если мы добавимwidth=600,height=600Все еще наклоняясь влево:

fig = px.bar(information,x="days",y="number",width=600,height=600)
fig.update_layout(xaxis_tickangle=-45)   # 倾斜角度设置

fig.show()   # 结果是向左倾斜

Настройки режима гистограммы

Существует четыре основных типа режимов отображения гистограммы:

  • стек: стек
  • группа: группировка
  • наложение: наложение
  • родственник: родственник
fig = px.bar(df4,
             x="sex",
             y="total_bill",
             color="smoker",
             barmode="stack"  # ['stack', 'group', 'overlay', 'relative']
            )

fig.show()

Отображение различий в 4 разных режимах:

граненая гистограмма

В качестве примера возьмем автономные данные наконечника:

fig = px.bar(df4,   # 带绘图数据 
             x="sex",  # x轴
             y="total_bill",   # y轴
             color="smoker",  # 颜色设置
             barmode="group",  # 柱状图4种模式之一
             facet_row="time",  #  行
             facet_col="day",  # 列
             category_orders={
                 "day": ["Thur", "Fri", "Sat", "Sun"],
                 "time": ["Lunch", "Dinner"]   # 分类顺序设置
                             }
            )
fig.show()

Необходимо обратить внимание на значение каждого отдельного представления параметра

Реализация гистограммы на основе go

Базовая гистограмма

Самостоятельный набор данных:

fig = go.Figure(
    data = (
        go.Bar(x=df1["name"].tolist(),  # x轴数据
               y=df1["score"].tolist()  # y轴数据
              )
    )
)

fig.show()

Сгруппированная столбчатая диаграмма

Есть также 4 различных режима гистограммы на выбор:

  • стек: стек
  • группа: группировка
  • наложение: наложение
  • родственник: родственник
fig = go.Figure(data=[
    go.Bar(name='小明', x=["语文","数学","英语"], y=[120, 104, 93]),
    go.Bar(name='小红', x=["语文","数学","英语"], y=[101, 88, 109])
])

# 柱状图模式需要设置：4选1
fig.update_layout(barmode='group')  # ['stack', 'group', 'overlay', 'relative']

fig.show()

Установить текст при наведении на текст hovertext

name = ['Product A', 'Product B', 'Product C']
number = [200, 500, 300]

fig = go.Figure(data=[go.Bar(x=name, 
                             y=number,
                             hovertext=['20% 市场份额 ', '50% 市场份额', '30% 市场份额'])])

fig.update_traces(marker_color='rgb(158,202,225)', # marker颜色
                  marker_line_color='rgb(8,48,107)', # 线条颜色
                  marker_line_width=1.5,   # 线宽
                  opacity=0.6)  # 透明度

fig.update_layout(title_text='3种产品市场份额')

fig.show()

Отображение информации о данных

Отображается 4 режима:

  • авто: автоматический
  • внутри: внутри
  • снаружи: снаружи
  • нет: нет
name = ['Product A', 'Product B', 'Product C']
number = [200, 500, 300]

fig = go.Figure(data=[go.Bar(x=name, 
                             y=number,
                             text=number,  # 显示number的数据信息
                             textposition="auto"  # ['inside', 'outside', 'auto', 'none']
                             )])

fig.update_layout(title_text='3种产品市场数量')

fig.show()

Режим отображения форматированного текста

import plotly.express as px

gap = px.data.gapminder().query("continent == 'Europe' and year == 2007 and pop > 2.e6")

gap.head()


fig = px.bar(gap, 
             x='country',
             y='pop', 
             text='lifeExp')

fig.update_traces(texttemplate='%{text:.2s}',   # 显示的整数位数：示例为2位
                  textposition='outside')   # 文本显示位置：['inside', 'outside', 'auto', 'none']

fig.update_layout(uniformtext_minsize=8,  # 显示文本字体大小
                  uniformtext_mode='show')  #  文本显示4种模式：[False, 'hide', 'show']

fig.show()

Метки оси X перекошены

import plotly.graph_objects as go

months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
          'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']

# 生成画布对象
fig = go.Figure()  


# 添加多个图形轨迹
fig.add_trace(go.Bar(
    x=months,
    y=[20, 14, 25, 16, 18, 22, 19, 15, 12, 16, 14, 17],
    name='产品A',
    marker_color='lightblue'  # 颜色的不同表示方法
))

fig.add_trace(go.Bar(
    x=months,
    y=[19, 14, 22, 14, 16, 19, 15, 14, 10, 12, 12, 16],
    name='产品B',
    marker_color='#af0010'
))

fig.update_layout(barmode='group',  # 柱状图模式
                  xaxis_tickangle=-45   # 倾斜角度
                 )
fig.show()

Индивидуальные настройки гистограммы

Мы по-прежнему строим собственный набор данных:

fig = go.Figure(data=[go.Bar(
    x=df1["name"].tolist(),  # 姓名作为x轴
    y=df1["score"].tolist(), # 分数作为y轴
    marker_color=colors  # 颜色设置：上面的colors
)])

fig.update_layout(title_text="期末成绩分数")

fig.show()

Настройка ширины гистограммы

# 不设置的话，每个柱状图是一样的宽度

fig = go.Figure(data=[go.Bar(
    x=df1["name"].tolist(),  # 姓名作为x轴
    y=df1["score"].tolist(), # 分数作为y轴
)])

fig.update_layout(title_text="期末成绩分数")

fig.show()

По умолчанию ширина каждого столбца одинакова:

Мы устанавливаем разную ширину для каждого столбца:

fig = go.Figure(data=[go.Bar(
    x=df1["name"].tolist(),  # 姓名作为x轴
    y=df1["score"].tolist(), # 分数作为y轴
    width=[1, 0.8, 0.4, 1.2, 0.4]  # 宽度设置
)])

fig.update_layout(title_text="期末成绩分数")

fig.show()

Изменить базовое положение гистограммы

import plotly.graph_objects as go

years = ['2018','2019','2020']

fig = go.Figure()

fig.add_trace(go.Bar(
    x=years, 
    y=[2000, 3000, 5000],
    # base另一种写法：np.array([2000, 3000, 5000]) * (-1)
    base=[-2000,-3000,-5000],  # 基准设置
    marker_color='crimson',
    name='商家A'))

fig.add_trace(go.Bar(
    x=years, 
    y=[3000, 4000, 2000],
    base=0,  # 默认基准设置
    marker_color='lightslategrey',
    name='商家B'
))

fig.show()

Положение легенды и цвет

Установите положение и цвет легенды:

import plotly.graph_objects as go

subjects = ["语文","数学","英语","物理","化学","生物"]

fig = go.Figure()
fig.add_trace(go.Bar(
    x=subjects,   # x轴、y轴数据             
    y=[90,85,78,90,99,80],                
    name='小明',  # 图例名称           
    marker_color='rgb(15, 83, 109)'  # 该组数据颜色
                
))

fig.add_trace(go.Bar(
    x=subjects,               
    y=[80,89,68,100,78,90],               
    name='小红',               
    marker_color='rgb(180, 118, 255)'
                ))

fig.update_layout(
    title='期末成绩对比',  # 整个图的标题
    xaxis_tickfont_size=12,   # x轴字体大小
    yaxis=dict(
        title='成绩',  # y轴的标题
        titlefont_size=16,  # 标题大小
        tickfont_size=12,  # y轴上的数值大小
    ),
    legend=dict(
        x=0,  # 图例的位置
        y=1,
#         bgcolor='rgba(255, 255, 255, 0)',  # 图例的背景色
        bordercolor='rgba(2, 255, 255, 0)'   # 边缘颜色
    ),
    barmode='group',  # 柱状图模式
    bargap=0.4,  # 组间距离
    bargroupgap=0.2  # 组内距离
)
fig.show()

Относительный режим относительного понимания

import plotly.graph_objects as go

x = [1, 2, 3, 4]

fig = go.Figure()
fig.add_trace(go.Bar(x=x, y=[1, 4, 9, 2]))
fig.add_trace(go.Bar(x=x, y=[6, -9, -1.5,4]))
fig.add_trace(go.Bar(x=x, y=[-10, -3, 4.5, -8]))
fig.add_trace(go.Bar(x=x, y=[-1, 3, -3, -4]))

fig.update_layout(
    barmode='relative',   # 相对初始位置
    title_text='相对模式理解')

fig.show()

режим стека

import plotly.graph_objects as go

subjects=['语文', '数学', '英语']

fig = go.Figure(go.Bar(
    x=subjects, 
    y=[69,71,120], 
    name='小明'))

fig.add_trace(go.Bar(
    x=subjects, 
    y=[64, 89, 116], 
    name='小红'))

fig.add_trace(go.Bar(
    x=subjects, 
    y=[76,104, 70], 
    name='张三'))

fig.update_layout(
    barmode='stack',   # 堆叠模式
    xaxis={'categoryorder':'total descending'})  # category ascending、category descending、total ascending、total descending

fig.show()

Несколько групп разделяют ось X

import plotly.graph_objects as go

x = [
    ["小明", "小明", "小明", "小红", "小红", "小红"],
    ["语文", "数学", "英语", "语文", "数学", "英语",]
]

fig = go.Figure()

fig.add_bar(x=x,
            y=[91,72,83,104,85,66],
            name="上学期"
           )
fig.add_bar(x=x,
            y=[106,85,64,93,72,81],
            name="下学期"
           )

fig.update_layout(barmode="relative")

fig.show()

Реализация горизонтальной гистограммы на основе пикселей

Базовая гистограмма

Два момента, на которые следует обратить внимание:

  • Данные осей x и y должны быть обменены
  • Добавить параметрыorientation 
df1 = pd.DataFrame({
    "name": ["小明","小红","周明","周红","张三"],
    "age": [20,28,18,25,36],
    "score": ["150","170","160","168","154"]
})

df1

image-20210422002520605

fig = px.bar(
    df1,
    y="name",   # xy轴的数据需要交换！！！
    x="age",
    orientation='h'   # 设置：改成水平柱状图
)
fig.show()

Отображение информации о данных

fig = px.bar(
    df1,
    y="name",   
    x="age",
    orientation='h',   # 水平柱状图
    text="age"   # 需要显示的数据
)
fig.show()

Текст по умолчанию отображается внутри и может быть изменен:

# 修改文本位置

fig = px.bar(
    df1,
    y="name",   # xy轴的数据需要交换
    x="age",
    orientation='h',   # 水平柱状图
    text="age"   # 需要显示的数据
)

fig.update_traces(textposition="outside")  # ['inside', 'outside', 'auto', 'none']

fig.show()

Установить параметры цвета

fig = px.bar(
    df1,
    y="name",   
    x="age",
    color="age",  # 颜色参数
    orientation='h',   # 水平柱状图
    text="age"   
)

fig.update_traces(textposition="outside")  # ['inside', 'outside', 'auto', 'none']

fig.show()

нестандартный цвет

fig = px.bar(
    df1,
    y="name",   
    x="age",
    color_discrete_sequence=px.colors.diverging.RdBu,  # 自定义颜色
    orientation='h',   # 水平柱状图
    text="age"   
)

fig.update_traces(textposition="outside")  # ['inside', 'outside', 'auto', 'none']

fig.show()

Чехол для наконечника

Многопараметрическая настройка личности

fig = px.bar(
    tips, 
    x="total_bill", 
    y="sex", 
    color='day', 
    orientation='h',
    hover_data=["tip", "size"],
    height=400,
    title='小费案例')
fig.show()

Реализация горизонтальной гистограммы на основе go

базовая графика

fig = go.Figure(go.Bar(
            x=df1["score"].tolist(),  # x轴数据
            y=df1["name"].tolist(),  # y轴数据
            orientation='h'))

fig.show()

установить цвет и режим

import plotly.graph_objects as go

# 生成画布
fig = go.Figure()

# 添加3个图形轨迹
fig.add_trace(go.Bar(
    y=['小明', '小红', '张三'],
    x=[120, 74, 103],
    name='语文',
    orientation='h',
    marker=dict(
        color='rgba(246, 78, 139, 0.6)',
        line=dict(color='rgba(246, 78, 139, 1.0)', width=3)
    )
))

fig.add_trace(go.Bar(
    y=['小明', '小红', '张三'],
    x=[92, 128, 89],
    name='数学',
    orientation='h',
    marker=dict(
        color='rgba(5, 71, 80, 0.6)',
        line=dict(color='rgba(58, 71, 80, 1.0)', width=3)
    )
))

fig.add_trace(go.Bar(
    y=['小明', '小红', '张三'],
    x=[92, 78, 69],
    name='英语',
    orientation='h',
    marker=dict(
        color='rgba(18, 7, 80, 0.6)',
        line=dict(color='rgba(58, 71, 80, 1.0)', width=3)
    )
))


fig.update_layout(barmode='stack')  # 堆叠模式:['stack', 'group', 'overlay', 'relative']


fig.show()

Сравнение 4 разных режимов:

Суммировать

В этой статье объединены собственные наборы данных и собственные наборы данных Plotly, чтобы подробно рассказать, как реализовать гистограммы и горизонтальные гистограммы с различными потребностями и методами отображения на основе plotly_express и plotly.graph_objects, Надеюсь, это будет полезно читателям и друзьям.

Категории