在线实例

默认效果 显示文本
水球半径 文本颜色
边框宽度 设置字体
数据多少 是否显示波纹
水球颜色 是否显示动画

使用方法

  1. <div class="wrap">
  2. <canvas id="sucaihuo"></canvas>
  3. </div>
复制
  1. <script>
  2. $(function(){
  3. $('#sucaihuo').waterbubble();
  4. });
  5. </script>
复制

jQuery waterbubble 水球图的更多相关文章

  1. 一款基于jQuery饼状图比例分布数据报表

    今天给大家带来一款基于jQuery饼状图比例分布数据报表.这款报表插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览  ...

  2. 8款耀眼的jQuery/HTML5焦点图滑块插件

    1.HTML5/CSS3超酷焦点图特效 带前后翻页按钮 今天要分享的这款HTML5/CSS3焦点图插件切换效果比较简单,但是外观和功能却十分强大.该CSS3焦点图在切换图片时,图片以淡入淡出的方式缩小 ...

  3. 使用echarts水球图

    使用echarts水球图 官方实例中没有水球图样式,当我们需要用到水球图的时候需要下载echarts-liquidfill.js. 使用 在echarts之后引入 echarts-liquidfill ...

  4. 【带着canvas去流浪（7）】绘制水球图

    目录 一. 任务说明 二. 重点提示 三. 示例代码 四. 文字淹水效果的实现 五. 关于canvas抗锯齿 六. 小结 示例代码托管在:http://www.github.com/dashnowor ...

  5. 带着canvas去流浪系列之七 绘制水球图

    [摘要] 用原生canvasAPI实现百度echarts 示例代码托管在:http://www.github.com/dashnowords/blogs 一. 任务说明 使用原生canvasAPI绘制 ...

  6. echarts水球图编写

    // 前提条件 需要引入这个插件<script src="./echarts-liquidfill.min.js"></script> // 代码 let ...

  7. v-charts 绘制柱状图、条形图、水球图、雷达图、折线图+柱状图，附官网地址

    v-charts 官网地址:https://v-charts.js.org/#/ 柱状图: <template> <ve-histogram :data="chartDat ...

  8. Python pyecharts绘制水球图

    一.水球图Liquid.add()方法简介 Liquid.add()方法签名add(name, data, shape='circle', liquid_color=None, is_liquid_a ...

  9. Jquery 轮播图简易框架

    =====================基本结构===================== <div class="carousel" style="width: ...

随机推荐

  1. JAVA笔记 之 JDK新特性

    JDK1.5新特性1.泛型(Generics) 为集合(collections)提供编译时类型安全,无需每刻从Collections取得一个对象就进行强制转换(cast) 2.增强的for循环(for ...

  2. POJ 1650 Integer Approximation

    Integer Approximation Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 5081   Accepted:  ...

  3. git clone简介

    翻译整理自: http://web.mit.edu/~mkgray/project/silk/root/afs/sipb/project/git/git-doc/git-clone.html  在使用 ...

  4. Linux 技巧：让进程在后台可靠运行的几种方法(转)

    下面举了一些例子, 您可以针对不同的场景选择不同的方式来处理这个问题. nohup/setsid/& 场景: 如果只是临时有一个命令需要长时间运行,什么方法能最简便的保证它在后台稳定运行呢? ...

  5. libevent源码深度剖析

    原文地址: http://blog.csdn.net/sparkliang/article/details/4957667 第一章 1,前言 Libevent是一个轻量级的开源高性能网络库,使用者众多 ...

  6. WCF多种调用方式兼容

    1.能被ajax get 2.能post 3.wcf正常调用 实现: [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompati ...

  7. SNF开发平台WinForm之四-开发-主细表管理页面-SNF快速开发平台3.3-Spring.Net.Framework

    4.1运行效果: 4.2开发实现: 4.2.1          有了第一个程序的开发,代码生成器的配置应该是没有问题了,我们只要在对应的数据库中创建我们需要的表结构就可以了,如下: 主表结构如下: ...

  8. EPANET中的哈希文件——hash.c

    /*-----------------------------------------------------------------------------**   hash.c****   Imp ...

  9. Hekaton的神话与误解

    最近这段时间,我花了很多时间来更好的理解Hekaton——SQL Sever 2014里的全新内存表技术.我看了很多文章,了解了Haktaon的各种内部数据存储结构(主要是哈希索引和Bw-tree). ...

  10. PHP--正则表达式和样式匹配--小记

    正则表达式: Regular expression PHP 支持两种风格的函数: POSIX 风格的,有些低版本软件支持,目前高版本的有些已经废弃不用了,比如 zend studio 的较新版本. p ...