系统后台图表生成文档说明-javascript
1.引入jquery插件文件datas.js
2.各图表分类
- 表格
$('#’+tableId).mTable({
url:'', //数据来源,[必填]
pageNum:1, //分页,默认为1,[可选]
data:'', //请求查询的数据,[可选]
format:[], //表格格式化顺序,根据返回的json的key值进行格式化,[必填]
datePicker:false, //表格是否包含日期组件,默认为false,[可选]
init:false, //表格日期组件初始化,[可选]
callback:function($table){//表格回调处理,可增加超链接,单独处理某一列,[可选]
}
});- 表格分页器
$('#'+pageId).mPage({
pageNum:1, //当前页,默认为1,[可选]
callback:function(pageNum){ //分页器回调,重置表格,[必填]
//加载表格,即
$('#'+tableId).mTable({...});
}
});- 图表控件
$("#"+chartId).mChart({
url:'', //请求数据URL,[必填]
type:'line', //图表类型,默认是折线图,柱状图type为column,[可选]
options:this.mData, //图表配置,已默认加载,[可选]
data:'', //入参,查询条件,[可选]
name:'订单量', //图表参数名称,[可选]
range :1, //图表横轴间距,已自动计算部分,[可选]
init:false //是否初始化日期控件和select控件值,默认首次加载时需为true,[可选]
});- 选择下拉框
$('.ui-select").mSelect({
target:'chart', //选择框改变,对应加载的控件id,暂时只支持chart组件,[必填]
url:'', //选择框改变,加载的数据源,[必填]
type:'line' //选择框改变,加载的chart组件类型,支持line,column,[可选]
});- 日期控件
$("#"+datepicker).mDate({
url:'', //加载的url,[必填]
target:'chart', //目标对象的id,[必填]
type:'chart', //修改的数据图表型,可选值chart和table,默认是chart,[可选]
format:[], //表格格式化格式标准,[可选]
name:'', //图表series的名称,[可选]
chartType:'line' //图表类型,可选值line和column,默认值是line,[可选]
});

浙公网安备 33010602011771号