从 xml 到 Jqplot 的动态数据用于饼图选项

发布于 2024-10-27 10:06:07 字数 831 浏览 7 评论 0原文

我一直在尝试使用提取的数组创建饼图来自 xml 文件的数据。它确实显示饼图，但不显示扇区的大小对应于数组中的值。令人惊讶的是，如果满足以下条件，代码就可以工作：我使用静态数组。

这是 xml 文件：

<?xml version="1.0" ?> 
 <A> 
  <a1>a1</a1> 
  <a2>a2</a2> 
 <C>20</C> 
 <C>30</C> 
 <C>50</C> 
 <C>60</C> 
 <C>70</C> 
 </A>

这是 javascript 文件（我只写了主要代码）：

var x=xmlDoc.getElementsByTagName("A"); 
var myvalues=new Array(); 
var staticarray = {5,5,5}; 


for (i=0;i<x.length;i++) 
{ 
myvalues[i]=x[i].getElementsByTagName("C")[0].childNodes[0].nodeValue; 
 } 


$(document).ready(function(){ 
$.jqplot.config.enablePlugins=true; 
 plot1 = $.jqplot('chart1', [myvalues]);    // Doesn't work 
 plot2 = $.jqplot('chart2', [staticarray]);  // Works

原文

I have been trying to create a pie chart using an array that extracts
data from an xml file.
It does display the pie chart but the size of the sectors do not
correspond to the values in the array. Surprisingly, the code works if
I use a static array.

This is the xml file:

<?xml version="1.0" ?> 
 <A> 
  <a1>a1</a1> 
  <a2>a2</a2> 
 <C>20</C> 
 <C>30</C> 
 <C>50</C> 
 <C>60</C> 
 <C>70</C> 
 </A>

This is the javascript file(I have written only the main code):

var x=xmlDoc.getElementsByTagName("A"); 
var myvalues=new Array(); 
var staticarray = {5,5,5}; 


for (i=0;i<x.length;i++) 
{ 
myvalues[i]=x[i].getElementsByTagName("C")[0].childNodes[0].nodeValue; 
 } 


$(document).ready(function(){ 
$.jqplot.config.enablePlugins=true; 
 plot1 = $.jqplot('chart1', [myvalues]);    // Doesn't work 
 plot2 = $.jqplot('chart2', [staticarray]);  // Works

分享到QQ

分享到微博

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

发布评论

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

倾城泪 2024-11-03 10:06:07

使用 parseInt() 将节点值转换为整数。

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.jqplot.min.js"></script>
    <script type="text/javascript" src="js/plugins/jqplot.pieRenderer.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/jquery.jqplot.min.css" />
</head>
<body>
    <div class="jqPlot" id="chart1" style="height: 480px; width: 90%;"></div>
    <script type="text/javascript">
  $.jqplot.config.enablePlugins = true; 

  xmlhttp=new XMLHttpRequest();
  xmlhttp.open("GET","test.xml",false);
  xmlhttp.send();
  xmlDoc=xmlhttp.responseXML;

  var x=xmlDoc.getElementsByTagName("C"); 
  var myvalues=new Array(); 
  for (i=0;i<x.length;i++) { 
    myvalues[i]=parseInt(x[i].childNodes[0].nodeValue); 
  } 

  $(document).ready(function(){ 
      $.jqplot.config.enablePlugins=true; 
        plot1 = $.jqplot('chart1', [myvalues], {
         seriesDefaults:{renderer:$.jqplot.PieRenderer}
        });
  });
    </script>
</body>
</html>

Use parseInt() to convert the node value to an integer.

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.jqplot.min.js"></script>
    <script type="text/javascript" src="js/plugins/jqplot.pieRenderer.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/jquery.jqplot.min.css" />
</head>
<body>
    <div class="jqPlot" id="chart1" style="height: 480px; width: 90%;"></div>
    <script type="text/javascript">
  $.jqplot.config.enablePlugins = true; 

  xmlhttp=new XMLHttpRequest();
  xmlhttp.open("GET","test.xml",false);
  xmlhttp.send();
  xmlDoc=xmlhttp.responseXML;

  var x=xmlDoc.getElementsByTagName("C"); 
  var myvalues=new Array(); 
  for (i=0;i<x.length;i++) { 
    myvalues[i]=parseInt(x[i].childNodes[0].nodeValue); 
  } 

  $(document).ready(function(){ 
      $.jqplot.config.enablePlugins=true; 
        plot1 = $.jqplot('chart1', [myvalues], {
         seriesDefaults:{renderer:$.jqplot.PieRenderer}
        });
  });
    </script>
</body>
</html>

回复收藏 0 原文

~没有更多了~