0

我正在使用 java 语言在 Web 应用程序中工作。我需要显示复合迷你图，因此我在 jsp 页面上使用迷你 jquery。我必须在画布上绘制迷你图的背景中设置图像。我正在使用此链接中的 sparkline jquery。

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

我正在写的代码是

var 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]; $('#id').sparkline(data1, { type:'line', normalRangeMin:0,normalRangeMax:0,spotRadius: '0',width: '630px', height :'100px', 复合: true, fillColor : false, lineColor: 'green' }); $('#id').sparkline(data2, { type:'line', normalRangeMin:0,normalRangeMax:0,spotRadius: '0',width: '630px', height :'100px', 复合: true, fillColor ：假，线条颜色：'红色'}）；

并在体内

上面的 jquery 允许我绘制复合线图，但是当我在标签上设置样式（背景图像）时，它不会在迷你图画布的背景中显示它，因为它自己添加了画布。我的问题是在迷你图画布后面显示背景图像。

为了解决上述问题，我尝试了许多其他 jquery，例如：

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

这适用于在画布上设置背景图像，但不允许复合线图。

另一个是

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

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

请给我您宝贵的建议，将背景图像设置在第一个 jquery 链接的迷你图画布后面，或者使用其他两个链接绘制复合线图的方法，或者如果有另一个 jquery 可用，我可以在迷你图上设置背景图像canvas 并支持复合折线图。

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

4

1 回答 1

0

现在我得到了在画布后面获取背景图像并在其上绘制复合线图的方法。

我正在使用此链接中的 sparklines.js。 http://willarson.com/code/sparklines/sparklines.html

根据给定的文档，我们必须调用 new Sparkline('canvas_id','data','opts').draw() ；接受 canvas_id 作为参数的函数。我使用相同的 canvas_id 调用相同的函数两次以绘制两条不同的线（或者您可以调用此脚本接受的任何其他类型的图形）。

第二个调用在第一个之上绘制另一个图表。（这与http://omnipotent.net/jquery.sparkline/脚本用于绘制复合图的方式相同）。这有助于我绘制复合图。函数调用如下所示：

新 Sparkline('canvas_id','data1','opts1').draw() ; 新 Sparkline('canvas_id','data2','opts2').draw() ;

为了在画布后面设置背景图像，我在画布标签中设置样式。

上面的解决方案对我来说很好，可以获得适当的结果。如果有人找到更好的答案。请张贴。

谢谢

于 2012-03-19T07:04:01.407 回答