highchart在打印时不显示条形图

时间:2013-03-15 05:09:46

标签: highcharts

我是highchart的新手,我正在使用它在我的网页上呈现条形图。但是打印时图表没有显示出来。只有X和Y轴使用值打印,但不打印条形图。 我正在使用IE8。条形图在IE8模式下可见(在打印时),但在IE8兼容模式下不可见。我需要让它在IE默认模式下工作,即IE8 compat。模式。

任何人都可以帮我解决这个问题。

我正在添加我的js函数的代码块,我在一个灯箱窗口中打印我的高图。

      var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'containerDivID',
            type: 'column'
        },
        title: {
            text: ''
        },
        xAxis: {
               categories: xDataValues

        },
        yAxis: {
            min: 0,
            title: {
                text: ''
            }
        },
        tooltip: {
            formatter: function() {
                return ''+
                    this.x +': '+ this.y +' kr';
            }
        },

        plotOptions: {
            column: {
                stacking: 'normal',
                borderWidth: 1,
                dataLabels: {
                    enabled: false,
                    color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
                }
            }
        }
        ,
        yAxis: {
            labels: {
                formatter: function() {
                    return this.value;
                }
            },
            title:{
                text: ''
            }
        },
        series: [
          {
            name: 'YAxis',
            color: '#37789F',
            data: yDataValues
        }

        ],
        credits:{
            enabled: false
        }
    });

在这个灯箱中我按下这个按钮时有一个打印按钮我正在调用window.print()来打印页面。在我的打印页面上,我可以看到y轴和x轴以及数据,但无法看到我的条形图。但如果我将IE8模式从Compatible改为IE8标准模式,那么我可以在打印时看到我的图表。

此致 岸堤

2 个答案:

答案 0 :(得分:0)

对我来说,我没有使用print()功能来打印图表,因为我需要用图表打印额外的数据;由于我的图表是报告的一部分。

请找到我写的自定义打印功能:

 function printReport() {
    w = window.open();
    var svg = myChart.getSVG();

    //clone the div you want to print which contains your chart
    var toprint = $('#bs-results') .clone();

    //replace the chart with the svg
    toprint.find('#graph_div').html(svg);

    //right the output to print it
    w.document.write(toprint.html());

    w.print();
    w.close();
}

答案 1 :(得分:-1)

请查看兼容性页面http://www.highcharts.com/documentation/compatibility,我们支持本机浏览器,但不支持兼容模式。