Question

我在我的网站上使用jqplot使用以下代码

    $(document).ready(function(){
var xticks = [ '0', '1', '2', '3', '4','5', '6', '7', '8', '9', '10','11', '13','14','15','16','17','18','19','20','21','22','23'];
  var data1 = [2,4,6,2,2,2,1,1,1,1,1,1,1,1,1,1,1,1,2,6,3,1,2,2,0,0,0,0,0,0,2,5,6,6,7,6,6,6,5,7,7,6,1,0,0,0,0];
  var plot2 = jQuery.jqplot ('chart1', [data1], 
    {
            animate : true,
            // Will animate plot on calls to plot1.replot({resetAxes:true})
            animateReplot : true,
            seriesDefaults : {
                pointLabels : {
                    show : true,
                    hideZeros : true,
                    location  : 's',
                    ypadding  : 12
                },
                renderer : $.jqplot.BarRenderer,
                rendererOptions : {
                    varyBarColor : true,
                    barPadding : -20
                }
            },
            axes : {
                xaxis : {
                    label : 'X axis',
                    fontFamily : 'OpenSans-Regular',
                    textColor : '#414141',
                    renderer : $.jqplot.CategoryAxisRenderer,
                    labelRenderer : $.jqplot.CanvasAxisLabelRenderer,
                    tickRenderer : $.jqplot.CanvasAxisTickRenderer,
                    ticks : xticks,
                    tickOptions : {
                        fontFamily : 'OpenSans-Regular',
                        textColor : '#414141',
                        angle : -90,
                        fontSize : '10pt'
                    }
                },
                yaxis : {
                    min : 0,
                    //max : 30,
                    tickInterval:5,
                    label : 'Y axis',
                    fontFamily : 'OpenSans-Regular',
                    textColor : '#414141',
                    // labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
                    tickOptions : {
                        fontFamily : 'OpenSans-Regular',
                        textColor : '#414141',
                        formatString : '%.2f',
                        fontSize : '10pt'
                    }
                }
            },
            cursor : {
                show : true,
                zoom : false,
                showTooltip : true,
                followMouse : true,
                useAxesFormatters : true

            /*
             * To show both x and y values showTooltipDataPosition :true,
             * showVerticalLine:true, useAxesFormatters:true
             */

            },

            legend : {
                renderer : $.jqplot.EnhancedLegendRenderer,
                show : true,
                showSwatches : true,
                fontFamily : 'OpenSans-Regular',
                marginTop : '100px',
                textColor : '#414141',
                rowSpacing : '14px',
                border : 'none',
                background : 'transparent',
                placement : 'outsideGrid'
            },
            grid : {
                background : 'transparent',
                gridLineColor : '#c5c5c5'
            },

            seriesColors : [ '#F6BD0F' ],
            series : [ {
                seriesColors : [ "#D85252" ],
                //label : 's1',
                color : [ '#D85252' ]
            }, {
                seriesColors : [ "#F6BD0F" ],
                label : 's2',
                color : [ '#F6BD0F' ]
            } ],
            highlighter : {
                show : false
            }

        }
  );
});

它在Firefox和IE9中运行良好，没有任何问题，如图1所示。但在IE8中，它看起来非常糟糕，如图2所示。

我已将excanvas.js包含在内，如下所示

<script type="text/javascript" language="javascript" src="jQuery/jQplot/excanvas.min.js"></script>

IE9和Firefox

IE8

这是工作jsfiddle 谁能告诉我如何解决这个问题？我在这里做错了什么？任何帮助将不胜感激..

Answer 1

最后，我在研究了一天后得到了答案

问题在于jqplot选项中使用的background属性。

grid : {
    background    : 'transparent',
    gridLineColor : '#c5c5c5'
}

我通过在代码中使用'transparent'替换'rgba(255, 255, 255, 0.1)'来修复它，它适用于包括IE8在内的所有浏览器。使用background:url('blank.gif')

可以实现同样的目的

我从以下链接获得了帮助

在ie8中，jqplot图形背景似乎是黑色的

1 个答案: