如何根据价值制作不同颜色的填充条?寻找JS解决方案

时间:2014-08-28 12:36:07

标签: javascript jquery css charts

我正在寻找创建实时图表的解决方案,如图所示,我查看了Highcharts,fusioncharts,raphaeljs以及更多其他人的样本,但找不到真正合适的东西。我已经尝试了很多使用fusioncharts LED小部件,但它没有必要的定制可能性。寻求您的帮助和建议,谢谢!

请看一下图片。我需要具有相同工作方式和外观和感觉的酒吧。

http://i.stack.imgur.com/UdGLz.png

2 个答案:

答案 0 :(得分:0)

我会通过以下方式说出这一点:如果值是>超过10(值)改变颜色。看看使用JQuery来改变div的颜色.css命令。要使条形移动,您还应该使用.animate()查看JQuery。如果您还没有访问www.codecademy.com并查看JQuery教程。 这可能没有直接给你代码,但你会从尝试使用这些资源中学到更多。希望它虽然有帮助=)

答案 1 :(得分:0)

对于CSS部分,您可以使用背景图像或渐变,并使用嵌入阴影部分隐藏它。

Javascript需要更新一个插入阴影值: CSS only DEMO

 box-shadow:inset 0 90px #333 /* this would be 10% for a 100px bar */