javascript - HighCharts 插件 JQuery

标签 javascript jquery highcharts

我使用 HighCharts 插件来绘制图表。但我遇到了一些麻烦:当图表为空时,我只看到 xAxis,而 yAxis 不显示。当图表不为空且有数据绘制图表时,yAxis 显示。我找不到解决此问题的方法。

function drawChart(jsonData) {
    var rate = 20;
    var is3Axis = $("#sel_charttype").val() == "1";

    var options = {
        chart: {
            renderTo: 'chart',
            defaultSeriesType: 'line',
            margin: [50, 65, 50, 55],
            backgroundColor: '#fff'
        },
        title: null,
        xAxis: {
            categories: jsonData.timeTicks
        },
        tooltip: {
            enabled: true,
            formatter: function () {
                return '<b>' + this.series.name + '</b><br/>' +
                    this.x + ': ' + this.y;
            }
        },
        plotOptions: {
            line: {
                dataLabels: {
                    enabled: true,
                    style: {
                        fontSize: '13px'
                    },
                    x: 0,
                    y: -10
                },
                marker: {
                    symbol: 'circle'
                }
            }
        },
        legend: {
            layout: 'horizontal',
            align: 'right',
            verticalAlign: 'top',
            x: -10,
            y: 0,
            floating: false,
            shadow: false,
            borderWidth: 0,
            itemStyle: {
                fontSize: '11px'
            }
        },
        credits: {
            enabled: false
        }
    };

    if (is3Axis) {
        options.yAxis = [
            //primary axis
            {
                title: {
                    text: 'Amount'
                },
                gridLineColor: '#f1f1f1'
            },
            {
                gridLineWidth: 0,
                title: {
                    text: 'Total',
                    style: {
                        //color: '#89A54E'
                    }
                },
                opposite: true
            }
        ];
        options.series = jsonData.summary3AxisData;
    } else {
        // options.chart.margin[1] = 30;
        options.yAxis = {
            title: {
                text: ''
            },
            gridLineColor: '#f1f1f1'
        };
        options.series = jsonData.summaryData;
    }

    if (chart)
        $("#chart").html('');

    chart = new Highcharts.Chart(options);

    if (jsonData.url) {
        $("#chart .highcharts-container").css("cursor", "pointer").click(function () {
            window.open(jsonData.url, "_self");
        });
    }
}

最佳答案

ShowEmpty 应该可以工作,已报告 here .

解决方法很简单:始终至少使用一个系列,例如设置 showInLegend: false,请参阅:http://jsfiddle.net/3UPQF/

请注意,需要设置轴的最小值和最大值。

关于javascript - HighCharts 插件 JQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19631997/

相关文章:

javascript - 在与 Ramda 的 react 中编写 setState

javascript - 如何使用 Jquery 在现有参数上添加值?

javascript - 使用 TableExport.js 将 HTML 表格导出为 PDF、WORD、PNG

Javascript 热图 ReferenceError h337.create

javascript - 如何使用 socket.io 发出事件来响应事件?

javascript - 如何在 Angular 中使用大写过滤器?

javascript - 使用 Highcharts-React 拖放不起作用

javascript - Highcharts 动画标记

javascript - 将关联数组声明为 new Array() 是否与将关联数组声明为对象 {} 相同?

javascript - 如何将这个数组结果值存储在数据库中?