空白图 - 未绘制数据

发布于 2024-10-20 15:04:50 字数 2303 浏览 1 评论 0原文

Javascript 代码 -

$.jqplot.config.enablePlugins = true;
var defaultHighlighter =  {tooltipAxes: 'y',showTooltip: true,tooltipLocation: 'n',tooltipOffset: 10,yvalues:1,formatString:'%.0f user'};                 
var globalTicks = [[-1,' '],[0,'12 am'],[1,'1 am'],[2,'2 am'],[3,'3 am'],[4,'4 am'],[5,'5 am'],[6,'6 am'],[7,'7 am'],[8,'8 am'],[9,'9 am'],[10,'10 am'],[11,'11 am'],[12,'12 pm'],[13,'1 pm'],[14,'2 pm'],[15,'3 pm'],[16,'4 pm'],[17,'5 pm'],[18,'6 pm'],[19,'7 pm'],[20,'8 pm'],[21,'9 pm'],[22,'10 pm'],[23,'11 pm'],[24,[' ']]];
var fullGraphOptions = {seriesDefaults: {pointLabels:{show:false},showMarker:true,markerOptions:{style: 'filledCircle'}},axes:{xaxis:{rendererOptions:{tickRenderer:$.jqplot.CanvasAxisTickRenderer},tickOptions:{angle:-45},ticks:globalTicks},yaxis:{min:0,tickOptions:{formatString:'%.0f'}}},highlighter:defaultHighlighter};        
fullanalysis1 = $.jqplot('hourlyGraph-1', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);
fullanalysis2 = $.jqplot('hourlyGraph-2', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);
fullanalysis3 = $.jqplot('hourlyGraph-3', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);
fullanalysis4 = $.jqplot('hourlyGraph-4', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);

所有四个图表都有相同的结果 -

在此处输入图像描述

根本不进行任何绘图。

我在代码中的数据只是一个示例。

可能是什么问题? Firefox 运行时的屏幕截图 Fedora 14。

谢谢大家。

编辑:我在 Firebug 控制台中没有收到任何错误。

Javascript code -

$.jqplot.config.enablePlugins = true;
var defaultHighlighter =  {tooltipAxes: 'y',showTooltip: true,tooltipLocation: 'n',tooltipOffset: 10,yvalues:1,formatString:'%.0f user'};                 
var globalTicks = [[-1,' '],[0,'12 am'],[1,'1 am'],[2,'2 am'],[3,'3 am'],[4,'4 am'],[5,'5 am'],[6,'6 am'],[7,'7 am'],[8,'8 am'],[9,'9 am'],[10,'10 am'],[11,'11 am'],[12,'12 pm'],[13,'1 pm'],[14,'2 pm'],[15,'3 pm'],[16,'4 pm'],[17,'5 pm'],[18,'6 pm'],[19,'7 pm'],[20,'8 pm'],[21,'9 pm'],[22,'10 pm'],[23,'11 pm'],[24,[' ']]];
var fullGraphOptions = {seriesDefaults: {pointLabels:{show:false},showMarker:true,markerOptions:{style: 'filledCircle'}},axes:{xaxis:{rendererOptions:{tickRenderer:$.jqplot.CanvasAxisTickRenderer},tickOptions:{angle:-45},ticks:globalTicks},yaxis:{min:0,tickOptions:{formatString:'%.0f'}}},highlighter:defaultHighlighter};        
fullanalysis1 = $.jqplot('hourlyGraph-1', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);
fullanalysis2 = $.jqplot('hourlyGraph-2', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);
fullanalysis3 = $.jqplot('hourlyGraph-3', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);
fullanalysis4 = $.jqplot('hourlyGraph-4', [[[63,63],[68,68],[87,87],[108,108],[135,135],[138,138],[147,147],[167,167],[130,130],[145,145],[144,144],[127,127],[134,134],[132,132],[147,147],[158,158],[157,157],[166,166],[170,170],[124,124],[107,107],[77,77],[62,62],[88,88]]], fullGraphOptions);

All the four graphs have the same result -

enter image description here

No plotting is done at all.

The data I have in the code is just a sample.

What could be the problem? The screenshot's of Firefox running on
Fedora 14.

Thank you,all.

Edit: I don't get any error in the Firebug console.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

她说她爱他 2024-10-27 15:04:50

您的数据格式似乎错误。您正在尝试用数组绘制单个系列的图表。不应将数据指定为 [63,63]、[68,68]、[87,87 ...],而应为 [63,68,87 ...]。这是让图表运行的正确方法:

var data = [63, 68, 87, 108,135,138,147,167,130];           

var globalTicks = ['12 am','1 am','2 am','3 am','4 am','5 am','6 am','7 am','8 am'];

var fullGraphOptions = {
    seriesDefaults: {
        pointLabels:{
            show:true
        },
        showMarker:true,
        markerOptions:{
            style: 'filledCircle'
        }
    },
    axes:{
        xaxis:{
            renderer: $.jqplot.CategoryAxisRenderer,
            tickRenderer:$.jqplot.CanvasAxisTickRenderer,                       
            tickOptions:{
                angle:-45
            },
            ticks:globalTicks
        },

        yaxis:{
            min:0,
            tickOptions:{
                formatString:'%.0f'
            }
        }
    },
    highlighter:defaultHighlighter
};        

fullanalysis1 = $.jqplot('chartdiv', [data], fullGraphOptions);

You seems to have got your data formatted the wrong way. You are trying to graph a single series with an array. Instead of giving data as [63,63],[68,68],[87,87 ...], It should be [63,68,87 ...]. Here is the right way to do get the chart running:

var data = [63, 68, 87, 108,135,138,147,167,130];           

var globalTicks = ['12 am','1 am','2 am','3 am','4 am','5 am','6 am','7 am','8 am'];

var fullGraphOptions = {
    seriesDefaults: {
        pointLabels:{
            show:true
        },
        showMarker:true,
        markerOptions:{
            style: 'filledCircle'
        }
    },
    axes:{
        xaxis:{
            renderer: $.jqplot.CategoryAxisRenderer,
            tickRenderer:$.jqplot.CanvasAxisTickRenderer,                       
            tickOptions:{
                angle:-45
            },
            ticks:globalTicks
        },

        yaxis:{
            min:0,
            tickOptions:{
                formatString:'%.0f'
            }
        }
    },
    highlighter:defaultHighlighter
};        

fullanalysis1 = $.jqplot('chartdiv', [data], fullGraphOptions);
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文