2012-03-14 103 views
0

我正在使用java language.i Web应用程序工作要求显示复合sparkline图形,因此我在jsp页面上使用sparkline jquery。我必须在画布上绘制迷你图的背景中设置图像。我从这个链接使用sparkline jquery。设置背景图像在画布上的sparkline jquery

http://omnipotent.net/jquery.sparkline/

和我写的代码是

变种DATA1 = [ - 10,10,9,-9,7,-5,9-,-8,3,0,3, -8,4,-7]; var data2 = [ - 10,0,6,-9,7,-5,9,-3,7,0,3,-8,4,-2]; sparkline(data1,{type:'line',normalRangeMin:0,normalRangeMax:0,spotRadius:'0',width:'630px',height:'100px',composite:true ,fillColor:false,lineColor:'green'}); sparkline(data2,{type:'line',normalRangeMin:0,normalRangeMax:0,spotRadius:'0',width:'630px',height:'100px',composite:true ,fillColor:false,lineColor:'red'});

和在身体

以上的jquery允许我绘制的复合线图,但是当我在标签设置样式(背景图像),它并没有显示它在后台sparklines画布,因为它本身增加了画布。我的问题是将背景图像正好显示在sparklines画布后面。

以上问题解决,我试图与其他许多jqueries,如:

http://willarson.com/code/sparklines/sparklines.html

这个工作得很好画布设置背景图片,但不会允许复合线图。

,另一个是

http://benpickles.github.com/peity/

我有同样的问题,这也。这也不适用于复合线图。

请给我你的宝贵建议,将背景图像精确地设置在第一个jquery链接的sparklines canvas后面或使用其他两个链接绘制复合线图的方式,或者如果有另一个jquery可用,这将允许我设置背景 - 在sparklines画布上的图像,并支持复合线图。

我感谢您提前提出的所有宝贵建议。

回答

0

现在我得到了让背景图像精确地位于画布后面并在其上绘制复合线图的方法。

我从这个链接使用sparklines.js。 http://willarson.com/code/sparklines/sparklines.html

按给定的文档,我们必须调用 新的迷你图( 'canvas_id', '数据', 'OPTS')绘制()。 函数接受canvas_id作为一个参数。我使用相同的canvas_id两次调用相同的函数来绘制两条不同的线(或者您可以调用此脚本接受的任何其他类型的图)。

第二次调用在第一个调用的顶部绘制另一个图表(这与http://omnipotent.net/jquery.sparkline/脚本用于绘制复合图形的方式相同)。这有助于我绘制复合图。函数调用如下所示:

new Sparkline('canvas_id','data1','opts1')。draw(); 新的Sparkline('canvas_id','data2','opts2')。draw();

和为背景图像完全设置在画布后面,我在画布标记中设置样式。

上面的解决方案工作正常,我得到了相应的结果。如果有人找到更好的答案。请发布。

谢谢