首页风格
门户
博客

GBin1博客视图 - 最近发布的文章-demo

超棒的仪表盘javascript类库 - justGage

超棒的仪表盘javascript类库 - justGage

在线演示  本地下载

还记得前端时间我们分享的动画仪表板javascript - gauge.js吧,使用它能够帮助我们迅速的构建一个超棒的动画仪表盘效果。

今天这里我们再介绍一款兼容性更好的动画仪表盘javascript类库:JustGage,这个类库基于著名的绘图类库 Raphaël ,能够提供更好的绘图兼容性。

支持浏览器

几乎支持所有的浏览器,包括:

  • IE6+
  • Chrome
  • Firefox
  • Safari
  • Opera
  • Android
  • 其它

如何使用

使用非常简单,首先导入 RaphaëlJustGage的类库,如下:

<script src="js/raphael.2.1.0.min.js"></script>
<script src="js/justgage.1.0.1.min.js"></script>

调用js生成一个新的仪表盘:

var…

标签: 仪表板, 仪表盘, 旋钮, 仪表板, javascript仪表板类库, justGage

阅读更多

使用HTML5画布实现的超棒javascript动画仪表板:gauge.js

使用HTML5画布实现的超棒javascript动画仪表板:gauge.js

在线演示

今天我们分享来自guage.js的超棒动画仪表板实现,这个类库使用html5画布来生成动态的自定义仪表板。不依赖于任何类库也不实用任何的CSS或者图片,完全使用画布生成。

拥有两套不同的UI,一个是仪表盘,一个类似原来我们介绍的jQuery knob界面。支持UI元素自定义你可以生成自己需要的颜色格式。

使用HTML5画布实现的超棒javascript动画仪表板:gauge.js

主要特性:

  • 无图片,CSS
  • 无类库依赖(支持jQuery,但是不是必须的)
  • 高度可配置
  • 分辨率独立
  • 动画数值变化
  • 支持主流浏览器

支持浏览器:

  • Chrome
  • Safari 3.2+
  • Firefox 3.5+
  • IE 9
  • Opera 10.6+
  • Mobile Safari (iOS 3.2+)
  • Android 2.3+

如何使用

var opts = {
lines: 12, // The number of lines to draw
angle: 0.21, // The length of each line
lineWidth: 0.44, // The line thickness

标签: 仪表盘, 旋钮, 仪表板, javascript仪表板类库, gauge.js

阅读更多

喜欢我们的文章请您与朋友分享:

?ü?à

今日推荐