图表顶部重叠的插图图例

Question

通过使用plotly，我创建了我的分析仪表板，其中包含饼图、条形图和不同类型的图表。我有一个饼图，里面有将近60多个巨大的数据和图例。它在浏览器(更大的屏幕)中渲染正常，问题出在移动屏幕上。图表图例与实际图表重叠。我希望在移动屏幕上显示图表，如下所示。有人能帮我这个忙吗。

​

​

我的Json如下所示。

{
  "data": [{
    "values": [1058,177,75,53,28,23,15,8,7,6,5,5,2,2,1,1,1,1,1,1,0],
    "labels": ["Vision Corporation","Corporate Human Resources","Human Resources-West","Human Resources-East","Human Resources-Central","Recruiting-East","Human Resources","Recruiting-South","Payroll","Recruiting-West","Human Resources-South","Recruiting-Central","200-Human Resources","Direction des Ressources Humaines","Accounts Payable","Commercial Sales","Commercial Sales-West","Services-East","Vision Australia","Vision Industries","Others"],
    "type": "pie",
    "textposition":"inside"
  }],
  "linked": {
    "layout": {
      "legend":{
        "orientation": "h",
        "x": 1.02,
        "xanchor": "center",
        "y": 1.0,
        "yanchor": "bottom"
      },
      "margin":{
        "l": 0
      }
    }
  }
}

Answer 1

免责声明:我还没有在手机上尝试过。然而，我在浏览器上遇到了类似的问题(巨大的图例)-以下确实解决了这个问题：

您可以控制图表的大小。通过增加height属性，可以为图例留出更多空间。

在“layout”对象下添加一个“height”属性，并调整大小以适合您的数据-

"layout": {
  "height": 1000, ...

如果需要，还可以添加宽度属性。参见示例here (不是用JSON语言编写的，但属性很清楚)。