滚动绘图滑块时如何更新 X 轴？

Question

该代码将长图像拆分为帧。目标是让y轴数值真实

import numpy as np
import plotly.graph_objects as go
import plotly.express as px

xg = np.random.rand(100, 22400)
# xg = np.random.rand(10, 1200)

base = px.imshow(xg, aspect="auto", color_continuous_scale="gray")
frameSize = 400

frames = [
    go.Frame(
        data=px.imshow(
            xg[:, x : x + frameSize], aspect="auto", color_continuous_scale="gray"
        ).data,
        name=x,
    )
    for x in range(0, xg.shape[1], frameSize)
]

base=go.Figure(data=frames[0].data, frames=frames, layout=base.layout).update_layout(
    updatemenus=[{
        "buttons": [{"args": [None, {"frame": {"duration": 500, "redraw": True}}],
                    "label": "&#9654;",
                    "method": "animate",
                },],
        "type": "buttons",
        }],
    sliders=[{
        "steps": [{"args": [[d],
                            {"frame": {"duration": 0, "redraw": True},
                             "mode": "immediate",},],
                    "label": d,
                    "method": "animate",
                  }
                  for d in range(0, xg.shape[1], frameSize)
                 ],
        }],
)

base.show()

还有一个问题，是否可以改变Y轴的值。（我需要把Y轴的所有值都乘以0.4）

Answer 1

可以按帧指定布局，因此可以使用此技术https://plotly.com/python/tick-formatting/#tickmode--array
同样的方法也用于缩放 y 轴，只需要在图形而不是每一帧上完成

import numpy as np
import plotly.graph_objects as go
import plotly.express as px

xg = np.random.rand(100, 22400)
# xg = np.random.rand(10, 1200)

base = px.imshow(xg, aspect="auto", color_continuous_scale="gray")
frameSize = 400

frames = [
    go.Frame(
        data=px.imshow(
            xg[:, x : x + frameSize], aspect="auto", color_continuous_scale="gray"
        ).data,
        layout={"xaxis":{"tickmode":"array","tickvals":[v for v in range(0, frameSize, frameSize//8)],
                        "ticktext":[v+x for v in range(0, frameSize, frameSize//8)]}},
      name=x,
    )
    for x in range(0, xg.shape[1], frameSize)
]

go.Figure(data=frames[0].data, frames=frames, layout=base.layout).update_layout(
    updatemenus=[{
        "buttons": [{"args": [None, {"frame": {"duration": 500, "redraw": True}}],
                    "label": "&#9654;",
                    "method": "animate",
                },],
        "type": "buttons",
        }],
    sliders=[{
        "steps": [{"args": [[d],
                            {"frame": {"duration": 0, "redraw": True},
                             "mode": "immediate",},],
                    "label": d,
                    "method": "animate",
                  }
                  for d in range(0, xg.shape[1], frameSize)
                 ],
        }],
).update_layout(yaxis={"tickmode":"array", "tickvals":[v for v in range(0, xg.shape[0], xg.shape[0]//5)],
                      "ticktext":[round(v*.4,2) for v in range(0, xg.shape[0], xg.shape[0]//5)]})

使用 JPEG 作为来源

import skimage.io, skimage.color

image_filename = "https://www.termitnjak.com/en/media/logos/python.jpeg/@@images/image.jpeg"
image_numpy = skimage.io.imread( image_filename )
xg = skimage.color.rgb2gray(image_numpy)
xg = np.tile(xg, 10)

滚动绘图滑块时如何更新 X 轴？

How to update X axis when scrolling plotly slider?

python-3.x

plotly

plotly-python

使用 JPEG 作为来源