ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript-浮点图不显示

2019-12-08 19:35:06  阅读:206  来源: 互联网

标签:flot javascript jquery


我正在尝试使用Flot库生成图形.

var d= [ [1293840000000,332],[1293926400000,321],[1294012800000,310],[1294099200000,299],[1294185600000,288],[1294272000000,277],[1294358400000,266],[1294444800000,255],[1294531200000,244],[1294617600000,233],[1294704000000,222],[1294790400000,211],[1294876800000,200],[1294963200000,189],[1295049600000,178],[1295136000000,167],[1295222400000,156],[1295308800000,145],[1295395200000,134],[1295481600000,123],[1295568000000,112],[1295654400000,101],[1295740800000,90],[1295827200000,79],[1295913600000,68],[1296000000000,57],[1296086400000,46],[1296172800000,35],[1296259200000,24],[1296345600000,13]];

$.plot($("#placeholder"), [d], { xaxis: { mode: "time" } });

上面生成了图.但是当我将d []中包含的数据包含在变量中时,我尝试使用

var d=[formateddata3];

哪里有formatteddata3

[1293840000000,332],[1293926400000,321],[1294012800000,310],[1294099200000,299],
[1294185600000,288],[1294272000000,277],[1294358400000,266],[1294444800000,255],
[1294531200000,244],[1294617600000,233],[1294704000000,222],[1294790400000,211],
[1294876800000,200],[1294963200000,189],[1295049600000,178],[1295136000000,167],
[1295222400000,156],[1295308800000,145],[1295395200000,134],[1295481600000,123],
[1295568000000,112],[1295654400000,101],[1295740800000,90],[1295827200000,79],
[1295913600000,68],[1296000000000,57],[1296086400000,46],[1296172800000,35],
[1296259200000,24],[1296345600000,13]

我正在考虑的问题是将值从变量传递到数组中.
我正在构建用于循环的formatteddata3.希望有人能以正确的方式帮助我

另外,当我用值(即一个不传递变量的值)提醒d时,我得到了

1293840000000,332,1293926400000,321,1294012800000,310,1294099200000,299,
1294185600000,288

而当我通过可变的警报时,我得到了

[1293840000000,332],[1293926400000,310],[1294012800000,288]

第一个生成图形…

//这里是要求的完整代码

var d1=[{!formateddata1}];
var d2=[{!formateddata2}];
var start = new Date(document.getElementById('Stardate').value);
var end= new Date(document.getElementById('CompleteDate').value);
var noofdays=datediff(start ,end,'days') ;
var hours= document.getElementById('page1:form2:amount').value ; 
var totalhours= {!est_project_hours};
var formateddata3='';
var cumhours=0;

for (var i=0;i<noofdays;i++)
{

 if (i==0)
 {
 cumhours=totalhours;

 formateddata3='['+start.getTime()+ ','+cumhours+'],[';
 alert(formateddata3);
 }
 else if(i==noofdays-1)
 {
 start.setDate(start.getDate()+1);
cumhours=cumhours-hours;

 formateddata3=formateddata3+start.getTime()+ ','+cumhours+']';


  }
  else
  {
  start.setDate(start.getDate()+1);
  cumhours=cumhours-hours;

  formateddata3=formateddata3+start.getTime()+ ','+cumhours+'],['
  }

  }   
   // when i use the d3 with these values the graph works  
  //var d3=[ [1293840000000,332],[1293926400000,321],[1294012800000,310],     [1294099200000,299],[1294185600000,288],[1294272000000,277],[1294358400000,266],[1294444800000,255],[1294531200000,244],[1294617600000,233],[1294704000000,222],[1294790400000,211],[1294876800000,200],[1294963200000,189],[1295049600000,178],[1295136000000,167],[1295222400000,156],[1295308800000,145],[1295395200000,134],[1295481600000,123],[1295568000000,112],[1295654400000,101],[1295740800000,90],[1295827200000,79],[1295913600000,68],[1296000000000,57],[1296086400000,46],[1296172800000,35],[1296259200000,24],[1296345600000,13]];
  //alert([formateddata3]);
  var d3=[];
  var d3=[formateddata3];// but when i use it like this it doesnt work
  alert('d3 value is '+d3);
  alert('d1 value is '+d1);
  alert('d2 value is '+d2);
  j$.plot(j$("#placeholder"),[ { label: "Timelog", data:d1 },{ label: "Avg", data:d2   },{ label: "Simulated", data:d3}],
 {
 series: {
 lines: { show: true },
 points: { show: true }
 },


 xaxis:
  { mode: "time",
  min: {!startdate},
   max: {!enddate}
  }
  ,yaxis: {
  min:0, tickSize: 5
  }

  });

解决方法:

更新

看来您正在将formateddata3构建为字符串. flot需要一个javascript数组.

var formateddata3 = new Array();

for (var i=0;i<noofdays;i++)
{
   if (i==0)
   {
      cumhours=totalhours;
   }
   else if(i==noofdays-1)
   {
      start.setDate(start.getDate()+1);
      cumhours=cumhours-hours;
   }
   else
   {
      start.setDate(start.getDate()+1);
      cumhours=cumhours-hours;
   }
   formateddata3.push(new Array(start.getTime(), cumhours));
}

然后直接将formatteddata3传递给flot.

标签:flot,javascript,jquery
来源: https://codeday.me/bug/20191208/2093706.html

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

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有