【问题标题】:Highcharts gauge fill to 100% of containerHighcharts 仪表填充到容器的 100%
【发布时间】:2013-03-11 20:36:17
【问题描述】:

此功能可通过 plotOptions size 参数用于饼图,但是在检查 Highcharts API 后,size 不适用于 Gauge。

size 饼图的 API 条目

考虑到这两个图表的相似性(圆形),我希望有一个类似的选项,但仪表总是填充我无法控制的容器 div 的某个子集。有没有其他人遇到过这个问题或找到了解决方案?

【问题讨论】:

    标签: highcharts gauge


    【解决方案1】:

    通过将间距设置为零,可以填满整个空间:

    http://jsfiddle.net/mkremer90/3sngK/1/

    调整spacing 参数以更改图表的填充量。至于像size 这样的百分比选项,我也找不到。

    【讨论】:

    • 啊,我在发布之前注意到了间距参数,并且我通过将 spacingLeft 参数设置为零来测试它,但我没有将它们全部设置为零(我有一个容器比它高得多,我认为spacingLeft会将它移到容器的左侧,但它留在了中间)。无论哪种方式,我都会继续执行此操作 - 感谢您的回答!
    • 没问题!如果它适合您,请务必接受答案。
    • 顺便说一句,如果边距没有一直到容器的边缘,您也可以将边距设置为负数。
    • 我也没有注意到margin 参数!我想我在 's' 区域接受过培训,正在寻找 size 参数,所以我只看到了间距 - 感谢您提供的好信息!
    • 大声笑,是的,有时文档可能大到看不到所有内容。哎呀,我在 HighCharts 源代码中发现了文档中没有的东西。
    【解决方案2】:

    我知道这是旧的,但如果像我一样,您将 borderWidth 设置为大于 0 的值,您会发现标签的位置(例如 x="5.5" y="5.5")与角落和宽度和高度缩小了。在这种情况下,设置间距和边距选项将无济于事。

    那么简单的解决方案就是完全避免将borderWidth 设置为任何值;只需将其保留为默认值或将其设置为零。相反,在您调用 highcharts 的容器元素上设置边框。

    或者,您可以设置负边距并增加容器元素的大小,以补偿图表上的位置偏移和大小缩小。可能需要使用 style="overflow: hidden;" 将容器包装在 div 中。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-01-11
      • 2015-02-23
      • 2018-05-24
      • 1970-01-01
      • 2017-06-20
      • 2017-08-06
      相关资源
      最近更新 更多