0

当它与 Chrome 和 FF 一起使用时,我无法用 IE 显示 2 个图表。只显示一张图表。这是我的代码:

function pie() {    
$('#pie_projet').highcharts({
    chart: {
        plotBackgroundColor: null,
        plotBorderWidth: null,
        plotShadow: false
    },
    title: {
        text: 'Nombre de projet ANRU par communes'
    },
    tooltip: {
        pointFormat: '{series.name}: <b>{point.y}</b>'
    },
    plotOptions: {
        pie: {
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
                enabled: true,
                connectorColor: '#000000',
                style: {
                    fontSize: '8px',
                    color: 'black'
                },
                format: '<b>{point.name}</b>: {point.y}'                    
            }
        }           
    },
    colors: [<?php echo join($tabSliceColor,',') ?>],
    series: [{
        type: 'pie',
        name: 'Nb projet',
        //document.getElementsByName(data_pie)[0].value
        data: [<?php echo join($data_pie, ',') ?>]
    }]

});
};

function groupBar() {   
$('#bar_projet').highcharts({
    chart: {
        type: 'column'
    },
    title: {
        text: 'Nombre d\'opérations par année et par type d opérations ANRU'
    },
    subtitle: {
        text: 'Source: Valenciennes Métropole'
    },
    xAxis: {
        categories: [<?php echo join($legend_bar,',') ?>],
        title: {
            text: null
        },
        labels: {
            rotation: -45,
            style: {
                fontSize: '9px'
            }
        }
    },
    yAxis: [{
        min: 0,
        max: 200,
        labels: {
            style: {
                color: 'red'
            }
        },
        title: {
            text: 'Nombre total d\'opérations',
            align: 'middle'
        },
        labels: {
            overflow: 'justify'
        },                
        opposite: true
    },
    // second yAxis
    {
        min: 0,
        max: 10,
        labels:{
            style :{
                color: 'red'
            }
        },
        title: {
            text: 'Nombre d\'opérations',
            align: 'middle'
        },
        labels: {
            overflow: 'justify'
        }
    }],
    tooltip: {
        valueSuffix: ' opérations'
    },
    legend: {
        layout: 'vertical',
        align: 'left',
        verticalAlign: 'top',
        x: 50,
        y: 60,
        floating: true,
        borderWidth: 1,
        backgroundColor: '#FFFFFF',
        shadow: true,
        itemStyle: {
            color: 'black', 
            fontSize: '7px'
        }
    },
    colors: [<?php echo join($tabOpColor,',') ?>],
    plotOptions: {
        series: {
            animation: false
        },
        spline: {
                dataLabels: {
                    enabled: true,
                    crop : false // permet de ne pas bloquer l'affichage d'un label si hot
                }
        }
    },
    series: [<?php echo join($series_bar,',') ?>,<?php echo $line_data?>]       
});

};

我称这两个函数是这样的:

<BODY onLoad ='pie();groupBar();'>

图表放在 DIV 中:

<div id='bar_projet' style='min-width: 400px; height: 400px; margin: 0 auto'></div>
<div id='pie_projet' style='min-width: 400px; height: 400px; margin: 0 auto'></div>

使用 IE 我只看到一张图表,第二张和 Chrome 和 FF 我看到它们。

谢谢你的帮助 !

4

2 回答 2

0

您是否尝试过在加载时使用 jquery 而不是在主体 onLoad 中对其进行初始化?

$(function () {
    pie();
    groupBar();
}
于 2013-09-27T13:20:27.400 回答
0

这个问题只出现在 IE 中,不会出现在任何其他浏览器中,对吗???使用检查器检查与您的图表相关联的标签的 ID,它们可能会重复(例如检查您的加载 div 的 ID),这是我通常会犯错误的地方。

这是因为当两个标签具有相同的 id 时,IE 会发疯。

希望能帮助到你

于 2013-09-27T13:25:21.173 回答