Plotly 图例在手机上无法缩放

Question

我正在使用 Dash 绘制一个情节。当我在桌面上查看它时，看起来不错

但是当我在手机上查看它时，图例位置与图表重叠。

我的传奇是使用设置的

legend=dict(
    bgcolor='rgba(0,0,0,0)',
    orientation="h",
    yanchor="bottom",
    y=-0.15,
    xanchor="left",
    x=0
)

如何修复图例？额外问题，如何修复模式栏？

Answer 1

我做了一个 hacky 解决方法。缩放问题的原因是手机上的屏幕宽度非常低（~300px），所以我将 body 的最小宽度设置为 500px

body {
    min-width:500px;
}

这会导致网站在首次加载后显得放大，因此我放入了小 JS 脚本

<meta id="myViewport" name="viewport" content="width=device-width" />
<script>
    window.onload = function () {
        if(window.innerWidth <= 500) {
            var mvp = document.getElementById('myViewport');
            mvp.setAttribute('content','width=500');
        }
    }
</script>

这似乎提高了它的可用性。这不是一个完美的解决方案，但是呃..我之前也有一个锁定的宽高比，但我已经解锁了手机的宽高比，所以它可以自由弯曲。