web299.com
全部
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
首页
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
当前位置:
首页
>
网页特效
>
图表
可生成循环流程图表的jQuery插件
分类:
图表
日期:
2024-05-14
点击(4)
评论(0)
演 示
免费下载
简介
#### 简要教程 smartCyle.js是一款可以生成循环流程图表的jQuery插件。流程图是使用图形表示算法的思路是一种极好的方法,该插件可以非常轻松的生成一个循环流程图系统,并且可以动态添加流程图中的节点。 #### 使用方法 要使用该循环流程图表插件需要在页面中引入jquery.js和smartCycle.min.js文件。 ```html ``` #### HTML结构 smartCyle.js循环流程图插件的HTML结构非常简单:使用一个
来包裹一组作为图表节点的元素。 ```html
A
B
C
D
E
F
center
``` #### 初始化插件 在页面DOM元素加载完毕之后,可以通过smartCycle()方法来初始化smartCyle.js插件。 ```html $(".anyone").smartCycle(); ``` 配置参数 smartCyle.js循环流程图插件有以下一些可用的配置参数: | 参数 |描述 | | ------------ | ------------ | | container_width | 包裹容器的宽度,默认值为420px。 | | container_height | 包裹容器的高度,默认值为420px。 | | radio | 对象到中心的距离,默认值为160px。 | | angle_ini | 开始角度,单位弧度,默认值为0。 | | direction | 箭头方向,可选值:'left'或'right',默认值为'right'。 | | diameter_object | 流程图节点对象的直径,单位像素,默认值为100px。 | | diameter_center | 中心对象的直径,单位像素,默认值为100px。 | | font_size | 字体大小,默认值为20像素。 | | type_arrows | 箭头的类型,可以是一个数组,默认值为:['➡'] | | arrows_size |箭头的大小,单位像素,默认值为60px。 | | radio_arrows |箭头到中心的距离,默认值为140px。 | | arrows_colors |箭头的颜色,可以是一个数组,默认值为:['#40A4C0']。 | | colors |循环流程图对象的颜色,可以是一个数组,默认值为:['#40A4C0','#40A4C0'] union:循环的组合属性:可见性、颜色和宽度。默认值为:false #F79646 10px,使用该属性的话箭头类型相同。 |
相关推荐
html5浪漫粒子表白文字特效
SlidesJS幻灯片特效
html5瀑布流相册特效
css3 svg实现的情人节表白鲜花动画特效
t-scroll.js基于ES6的DOM元素,过渡动画库插件
纯js写省市区三级联动效果
广告
广告