Cufflinks绘图Y轴无序问题排查及轴标签自定义咨询

一、Y轴显示混乱的核心原因 #

你碰到的这个Y轴无序问题，根源在于**time字段的格式是字符串类型（比如days 09:29:11），而非可被识别的数值/时间间隔类型**。

当你执行unstack(level=-2)后，cufflinks底层依赖的plotly会把这种字符串格式的时间当成离散的分类值来处理。分类值的排序逻辑是字符串的字典序，而不是实际的时间长度——比如days 00:55:00会排在days 09:29:11前面，但如果是时间长度的话，后者明显更长，这就导致Y轴顺序和实际数据不符。

至于未unstack时图表正常，是因为此时的数据结构让plotly还能按原始数据的顺序渲染，没有触发分类排序的逻辑；但unstack后数据结构发生变化，字符串的分类属性被激活，排序就乱了。

而把time转换成总秒数（数值类型）后，plotly就能依据数值大小正确排序Y轴，自然就解决了问题。

二、自定义轴标签提升可读性的方法 #

要给图表设置清晰的轴标签，直接通过cufflinks的layout参数就能实现，下面给你几个实用的示例：

基础自定义 #

# 以转换为秒数后的df1_bct_pos_ctimes3为例
df1_bct_pos_ctimes3.iplot(
    kind='scatter',
    layout={
        'xaxis': {'title': 'Pos Slot（位置槽）'},
        'yaxis': {'title': '累计耗时（秒）'}
    }
)

进阶样式自定义 #

如果需要调整标签的字体大小、颜色，让图表更美观，可以在轴的配置里添加更多参数：

df1_bct_pos_ctimes3.iplot(
    kind='scatter',
    layout={
        'xaxis': {
            'title': 'Pos Slot',
            'titlefont': {'size': 14, 'color': '#2c3e50'}
        },
        'yaxis': {
            'title': '总耗时',
            'titlefont': {'size': 14, 'color': '#2c3e50'},
            'tickfont': {'size': 12}  # 还能调整刻度字体
        }
    }
)

保留原始时间格式的方案 #

如果你不想把时间转成秒数，想保留days HH:MM:SS的显示格式，可以先把字符串转成timedelta类型，再绘图：

import pandas as pd

# 将字符串time转换为pandas的timedelta类型
df1_bct_pos_ctimes['time'] = pd.to_timedelta(df1_bct_pos_ctimes['time'])

# 执行unstack后再绘图，plotly能正确识别timedelta并按时间长度排序
df1_bct_pos_ctimes.unstack(level=-2).iplot(
    kind='scatter',
    layout={'yaxis': {'title': '耗时'}}
)

内容的提问来源于stack exchange，提问作者Aasheet Kumar