javascript – Flot无法在某些浏览器上呈现图表

2019-07-23 05:36:19 阅读：232 来源： 互联网

我有一个包含2个系列的简单折线图,x轴是日期,y轴是整数.说明这一点的代码如下：

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" language="javascript" src="flot/jquery.js"></script>
    <script type="text/javascript" language="javascript" src="flot/jquery.flot.js"></script>
    <style type="text/css">
        #overview-plot24 {
            width: 94%;
            margin-left: 20px;
            height: 220px;
        }
    </style>

    <script type="text/javascript">
        $(function() {
            var plotOptions = {
                //Options go here
                xaxis: {
                    mode: "time",
                    tickLength: 5,
                    reserveSpace: true,
                    autoscaleMargin: 0.01
                },
                yaxis: {
                    min: 0
                },
                legend: {
                    show: false
                },
                series: {
                    lineWidth: 1,
                    shadowSize: 0
                },
                grid: {
                    hoverable: true,
                    clickable: true
                }
            };

            var plot2 = $.plot(
                    '#overview-plot24', [
                        {
                            label: "Alerts",
                            color: "#FC8200",
                            data: [
                                    [Date.parse("2013-03-19 15:00"), 9650],
                                    [Date.parse("2013-03-19 16:00"), 33124],                                
                                    [Date.parse("2013-03-19 17:00"), 27806],
                                    [Date.parse("2013-03-19 18:00"), 24143],
                                    [Date.parse("2013-03-19 19:00"), 7573],
                            ]},
                        {
                            label: "Scores",
                            color: "#8000FF",
                            data: [                            
                                    [Date.parse("2013-03-19 15:00"), 26407],
                                    [Date.parse("2013-03-19 16:00"), 93973],
                                    [Date.parse("2013-03-19 17:00"), 77760],                                
                                    [Date.parse("2013-03-19 18:00"), 68715],
                                    [Date.parse("2013-03-19 19:00"), 20383],
                            ]
                        }
                    ],
                    plotOptions
            );
        });
    </script>
</head>

<body>
    <div id="overview-plot24"></div>
</body>
</html>

这在Chrome和Opera中正确呈现,但该系列无法在Safari和Firefox上呈现.
Chrome渲染是正确的.
Safari和Firefox呈现错误.

这很麻烦,因为flot网页上的示例在所有浏览器上都能正确呈现,我很难看到我的代码在哪里不同！

对于那些有兴趣直接运行代码的人来说,包含所有需要的zip存档是available.

解决方法:

这可能是Date.parse函数在Safari和Firefox上无法正常工作的问题吗？我认为识别的日期格式是依赖于实现的,并且在不同的浏览器中可能不一致.

有关详细信息,请参见this question

标签：javascript,charts,flot
来源： https://codeday.me/bug/20190723/1510173.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript – Flot无法在某些浏览器上呈现图表