Javascript 自动创建网页时间图表有什么问题？

!！解决了

我想用用户和他们在网站页面上花费的时间自动创建图表

我有一个文件-log.xml，我在其中保存用户信息、客户信息、访问过的页面信息、日期信息及其花费的时间；在我用Ajax获得这个Xml文件之后，我想解析它，并用JqPlot提取的图表创建值

我的问题是，我不能通过一个以上的客户进行循环，而且它不能为单个客户构建图表

如果我通过变量plot的初始化删除代码块，我就可以从Xml中遍历所有客户

请，如果有人能告诉我什么是错误的，以及如何为所有客户创建图表

以下是文件log.xml的代码：

以下是操作的javascript代码：

$(document).ready(function()
{
    //read from xml
    $.ajax({
        type: "GET",
        url: "log.xml",
        dataType: "xml",
        success: parseXml
    });
});//ready          

//parse xml          
function parseXml(xml) {
    var i = 0;
    $(xml).find("customer").each(function() {
        $('<div class = "jqplot graph" id = "chart' + i + '"></div>').appendTo('#content');
        var customerName = $(this).attr("name");                                     
        var line_inside = [];  // declare as array               
        $(this).find("page").each(function() {
          var pageName = $(this).attr("name"); 
          $(this).find("date_ts").each(function() {
            var timeSpent_ = $(this).attr("timeSpent");//if mai multe timespent, sa faca totalul, else singuru; timespent
            line_inside.push([pageName,timeSpent_]); //do not string cat, push onto array
          });                        
        });                    
        var line = '[' + line_inside + ']';
        //--------jqplot----!!! if i remove this block, will loop through customers------------
        var plot = $.jqplot('chart' + i, [line_inside], 
        {                            
            title: customerName,
            series:[{renderer:$.jqplot.BarRenderer}],
            axes: {
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer,
                    label: 'Web Page',
                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
                    tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                    tickOptions: { labelPosition:'middle',  angle: -30 }  
                },
                yaxis: {
                    autoscale:true,
                    label: 'Total Time Spent',
                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
                    tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                    tickOptions: { labelPosition:'middle', angle: -30 }
                }
            }
        });
        //-------jqplot----!!! if i remove this block, will loop through customers------------                                
        i++;
    });//find customer            
}//parse xml    

解决方案：根据Mark的建议进行修改，效果良好。

---

现在，上面的代码可以工作了

因为您希望为每个客户使用不同的绘图，所以需要将绘图作为内联函数的局部变量：var plot而不仅仅是plot-line也是如此。当前，您正在分配一个全局范围变量并每次都覆盖它。

您正在将看起来像数组而不是实际数组的字符串传递给jqplot

:

---

我按照你说的做了修改，但是没有效果。。。变量行='['+line_-in+']'；var plot=$.jqplot'chart'+i[line]，如果在执行该代码块时循环停止，我怀疑您可能会遇到运行时错误。您的浏览器的JavaScript控制台中是否出现任何错误？我的浏览器的JavaScript控制台中没有错误。您的XML缺少第一条客户记录的关闭标记。那只是个打字错误吗？对不起，那只是个打字错误；我是从Mysql数据库生成Xml的，它是有效的。这里，我刚刚从hole Xml文件中提取了两个客户。

$(document).ready(function()
{
    //read from xml
    $.ajax({
        type: "GET",
        url: "log.xml",
        dataType: "xml",
        success: parseXml
    });
});//ready          

//parse xml          
function parseXml(xml) {
    var i = 0;
    $(xml).find("customer").each(function() {
        $('<div class = "jqplot graph" id = "chart' + i + '"></div>').appendTo('#content');
        var customerName = $(this).attr("name");                                     
        var line_inside = [];  // declare as array               
        $(this).find("page").each(function() {
          var pageName = $(this).attr("name"); 
          $(this).find("date_ts").each(function() {
            var timeSpent_ = $(this).attr("timeSpent");//if mai multe timespent, sa faca totalul, else singuru; timespent
            line_inside.push([pageName,timeSpent_]); //do not string cat, push onto array
          });                        
        });                    
        var line = '[' + line_inside + ']';
        //--------jqplot----!!! if i remove this block, will loop through customers------------
        var plot = $.jqplot('chart' + i, [line_inside], 
        {                            
            title: customerName,
            series:[{renderer:$.jqplot.BarRenderer}],
            axes: {
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer,
                    label: 'Web Page',
                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
                    tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                    tickOptions: { labelPosition:'middle',  angle: -30 }  
                },
                yaxis: {
                    autoscale:true,
                    label: 'Total Time Spent',
                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
                    tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                    tickOptions: { labelPosition:'middle', angle: -30 }
                }
            }
        });
        //-------jqplot----!!! if i remove this block, will loop through customers------------                                
        i++;
    });//find customer            
}//parse xml    

var line_inside = [];  // declare as array               
$(this).find("page").each(function() {
  var pageName = $(this).attr("name"); 
  $(this).find("date_ts").each(function() {
    var timeSpent_ = $(this).attr("timeSpent");//if mai multe timespent, sa faca totalul, else singuru; timespent
    line_inside.push([pageName,timeSpent_]); //do not string cat, push onto array
  });                        
});
alert(line_inside); // this is an array of arrays                                   
var plot = $.jqplot('chart' + i, [line_inside],