Question

我们有一些使用

的图形

highcharts 2.5.1 back in 2011 bundled with Jquery 1.4.2

并且一切正常确定，但我们保存了一些其他javascript插件，我们还需要升级它们latest releases have some bug fixed and we want to take advantage of them并且还需要Jquery upgrade as well但是当我升级到最新版本时jquery version

jquery-1.11.1.min然后highcharts似乎不再有效？

我该怎么做才能使它像使用JQuery 1.4.2

一样工作

示例代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Highcharts Example</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>      
    <script type="text/javascript" src="../js/highcharts.js"></script>
    <script type="text/javascript">

        var chart;
        $(document).ready(function() {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    defaultSeriesType: 'bar'
                },
                title: {
                    text: 'Stacked bar chart'
                },
                xAxis: {
                    categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: 'Total fruit consumption'
                    }
                },
                legend: {
                    backgroundColor: '#FFFFFF',
                    reversed: true
                },
                tooltip: {
                    formatter: function() {
                        return ''+
                             this.series.name +': '+ this.y +'';
                    }
                },
                plotOptions: {
                    series: {
                        stacking: 'normal'
                    }
                },
                    series: [{
                    name: 'John',
                    data: [5, 3, 4, 7, 2]
                }, {
                    name: 'Jane',
                    data: [2, 2, 3, 2, 1]
                }, {
                    name: 'Joe',
                    data: [3, 4, 4, 2, 5]
                }]
            });                         
        });             
    </script>       
</head>
<body>
    <div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
</body>

生成正确的输出

Using JQuery 1.4.2

如果我像这样更改JQuery version

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

生成类似的东西。

我看到像

这样的东西

Using jQuery 1.11

also tested con JQuery 1.10

Answer 1

检查compatibility page of highcharts

jQuery  

1.4.3 - 1.10.x for all browsers.
2.0.x for modern browsers.

如果可以，请尝试使用1.10.x.如果您仍然看到问题，我建议创建一个问题的jsFiddle演示＆amp;在这报告。 SO专家或Highcharts支持团队可以在您使用官方支持的jQuery版本时为您提供帮助。

修改

您的代码效果很好，请查看@ http://jsfiddle.net/jugal/9g3679zk/

您可能还需要升级Highcharts js

编辑2

使用Highcharts 2.1.5 @ http://jsfiddle.net/jugal/9g3679zk/1/图表不会如您所示加载，在调整大小窗口时，它会重新绘制并显示图表。

升级到2.2似乎解决了问题@ http://jsfiddle.net/jugal/9g3679zk/2/您很可能应该能够使用现有许可证从2.1升级到2.2。

在jquery升级之后，Highcharts无法正常工作

1 个答案: