5

我需要蜘蛛网或风玫瑰图等极坐标图的 y 轴方面的帮助。我有一个带有仪表板的应用程序，其中包含一些小部件，每个小部件都包含一个带有 Highcharts 图表的 iframe。因为这些小部件是 reziable，所以我有一些用于调整图表容器大小的 javascript。

    $(window).bind("resize", resizeChart);
    function resizeChart() {
        var width = $(document).width() - 55;
        var height = $(document).height() - 60;
        $("#container").css("width", width);
        $("#container").css("height", height);
    }

一些例子：http: //jsfiddle.net/CwnDw/

我的问题是，y 轴的比例通常看起来很丑。当图表加载时，y 轴只有一个刻度。将图表大小调整为 + 10 px 后，它不包含刻度，调整到初始大小后，y 轴呈现 5 个刻度。我不明白为什么。在我的示例中，只有当我非常快速地将图表从小尺寸调整到大尺寸时，我才会得到这些效果。

有没有更好的方法来调整图表的大小？我尝试了 chart.setSize() 函数，但没有效果。或者：有没有办法重新渲染/重新计算 y 轴？

谢谢托本

4

2 回答 2

1

我不确定是否有一种重绘方法可以完成您正在寻找的内容，但根据我使用 Highcharts 的经验，我发现最好指定刻度位置以避免任何意外结果。

这是 Highchart 文档的链接yAxis: tickPosition

http://api.highcharts.com/highcharts#yAxis.tickPositions

那里有一个很好的 jsFiddle 示例，应该涵盖实现。

于 2013-08-12T14:56:14.673 回答
0

Try this:

function resizeChart() {
    var width = $(document).width() - 55;
    var height = $(document).height() - 60;
    $("#container").css("width", width);
    $("#container").css("height", height);
    setTimeout(function () {
         chart1.setSize(
            width,
            height,
            false
        );
    },10);
}

http://jsfiddle.net/9YFB8/2/

于 2013-08-12T14:34:12.860 回答