amchart使用总结
具体属性参考：http://wenku.baidu.com/link?url=7EcOqGOGUxM22mo_nPYO5DhQA7NjephU5en6vi8RLyD-uBJ6tnWxLvtV0AJqyfUSEmkcuDr44BCvePzU269I1IbRn7Rhp2_4pT-BOGVaJnq
实例介绍：
amcharts.js编写：
var ChartsAmcharts = function() {
var initChartTrackState = function(data) {//月 客户各跟踪状态
var chart = AmCharts.makeChart("chart_track_state", {
"theme": "light",
"type": "serial",
"startDuration": 2,
"fontFamily": 'Open Sans',
"color": '#888',
"dataProvider":data,
//Y轴属性设置
"valueAxes": [{
"axisAlpha": 1,//设置Y轴的透明度
"gridAlpha": 0,//网格的透明度
"axisColor":"#FF6600",//轴的颜色
"minimum":0,//Y轴最小值
"integersOnly":true,//是否只显示整数
"position": "left",//Y轴显示的位置
"title": "客户数量(个)"
}],
//图形设置
"graphs": [{
"balloonText": "[[category]]: [[value]]",
"colorField": "color",//图形颜色
"fillAlphas": 0.75,
"lineAlpha": 0.1,
"type": "column",//类型：线状，柱状，饼状
"topRadius": 1,
"valueField": "counts" //绑定数值，与data中的属性名一致
}],
"columnWidth":0.5,//设置每个柱状图的宽度
"depth3D": 30,//设置3D效果
"angle": 20,
"chartCursor": {
"categoryBalloonEnabled": false,
"cursorAlpha": 0,
"zoomable": false
},
"categoryField": "name",//X轴数值绑定，与data中的属性名一致
//X轴的设置
"categoryAxis": {
"title":"跟踪状态",
"gridPosition": "start",
"axisAlpha": 1,
"gridAlpha": 0
},
"exportConfig": {
"menuTop": "1px",
"menuRight": "1px",
"menuItems": [{
"icon": '/lib/3/images/export.png',
"format": 'png'
}]
}
}, 0);
//chart_track_state前端页面需要显示的div的id
$('#chart_track_state').closest('.portlet').find('.fullscreen').click(function() {
chart.invalidateSize();
});
}
var initChartCloseCustomer = function(data) {//月关单客户
var chart = AmCharts.makeChart("chart_close", {
"theme": "light",
"type": "serial",
"startDuration": 2,
"fontFamily": 'Open Sans',
"color": '#888',
"dataProvider":data,
"valueAxes": [{
"axisAlpha": 1,
"gridAlpha": 0,
"minimum":0,//Y轴最小值
"integersOnly":true,//是否只显示整数
"position": "left",
"title": "客户数量(个)"
}],
"graphs": [{
"balloonText": "[[category]]: [[value]]",
"colorField": "color",
"fillAlphas": 0.75,
"lineAlpha": 0.1,
"type": "column",
"topRadius": 1,
"valueField": "nums"
}],
"columnWidth":0.5,
"depth3D": 30,
"angle": 20,
"chartCursor": {
"categoryBalloonEnabled": false,
"cursorAlpha": 0,
"zoomable": true
},
"categoryField": "yearmonth",
"categoryAxis": {
"title":"年月",
"gridPosition": "start",
"axisAlpha": 1,
"gridAlpha": 0
},
"exportConfig": {
"menuTop": "8px",
"menuRight": "8px",
"menuItems": [{
"icon": '/lib/3/images/export.png',
"format": 'png'
}]
}
}, 0);
$('#chart_close').closest('.portlet').find('.fullscreen').click(function() {
chart.invalidateSize();
});
}
return {
//main function to initiate the module
initChartTrackState: function(date) {
initChartTrackState(date);
},
initCloseCustomer: function(date) {
initChartCloseCustomer(date);
}
};
}();
//前端页面
Version:0.9StartHTML:-1EndHTML:-1StartFragment:0000000111EndFragment:0000039290
<#---->后台json数据绑定：使用的是JFinal框架
Version:0.9StartHTML:-1EndHTML:-1StartFragment:0000000111EndFragment:0000028523
package com.netfinworks.oa.controller; import com.jfinal.core.Controller; import com.jfinal.plugin.activerecord.Db; import com.jfinal.plugin.activerecord.Record; import com.netfinworks.oa.utils.DateUtils; import com.netfinworks.oa.utils.WeekUtils; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Date; import java.util.List; public class ReportController extends Controller{ /*** * 统计指定日期当月客户各跟踪状态 */ public void countTractStateByMonth() { Listlst = new ArrayList (); String firstDay = DateUtils.getFirstDay(new Date(), 0); String nextFirstDay = DateUtils.getFirstDay(new Date(), 1); lst = Db.find("select ts.name,count(ch.new_track_state_id) as counts,case when ch.new_track_state_id=1 then 'red'\n" + "\twhen ch.new_track_state_id=2 then 'orange'\n" + "\twhen ch.new_track_state_id=3 then 'yellow'\n" + "\twhen ch.new_track_state_id=4 then 'green'\n" + "\twhen ch.new_track_state_id=5 then 'blue'\n" + "\twhen ch.new_track_state_id=6 then 'purple'\n" + " end as color from customer_history ch,track_state ts,\n" + "(select t.customer_id,max(t.change_time) as change_time from customer_history t where t.change_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d') group by t.customer_id ) as temp \n" + "where temp.customer_id=ch.customer_id and temp.change_time=ch.change_time\n" + "and ts.id=ch.new_track_state_id\n" + "and ch.new_track_state_id is not null group by ch.new_track_state_id", firstDay, nextFirstDay); renderJson(lst); } /** * 统计按周显示客户跟踪状态 * countWeekReportByTackeState */ public void countWeekReportByTackeState(){ List lst = new ArrayList (); SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd"); String firstWeek=df.format(WeekUtils.getFirstDayOfWeek(new Date())); String lastWeek=df.format(WeekUtils.getLastDayOfWeek(new Date())); lst=Db.find("\tselect ts.name,ch.new_track_state_id,count(ch.new_track_state_id) as counts,\tcase when ch.new_track_state_id=1 then 'red'\n" + "\twhen ch.new_track_state_id=2 then 'orange'\n" + "\twhen ch.new_track_state_id=3 then 'yellow'\n" + "\twhen ch.new_track_state_id=4 then 'green'\n" + "\twhen ch.new_track_state_id=5 then 'blue'\n" + "\twhen ch.new_track_state_id=6 then 'purple'\n" + " end as color from customer_history ch,track_state ts,\n" + "\t(select t.customer_id,max(t.change_time) as change_time from customer_history t where t.change_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d') group by t.customer_id ) as temp \n" + "\twhere temp.customer_id=ch.customer_id and temp.change_time=ch.change_time\n" + "\tand ts.id=ch.new_track_state_id\n" + "\tand ch.new_track_state_id is not null group by ch.new_track_state_id",firstWeek,lastWeek); renderJson(lst); } /*** * 统计上月、本月、下月关单的客户 *countCloseCustomerByMonth */ public void countCloseCustomerByMonth(){ List lst = new ArrayList (); String lastFirstDay=DateUtils.getFirstDay(new Date(),-1);//上月第一天 String firstDay=DateUtils.getFirstDay(new Date(),0);//本月第一天 String nextFirstDay=DateUtils.getFirstDay(new Date(),1);//下月第一天 String neFirstDay=DateUtils.getFirstDay(new Date(),2);//下下月第一天 lst=Db.find("select count(ch.id) as nums,case when count(ch.id)=0 then date_format(?,'%Y%m')\n" + "else date_format(temp.change_time,'%Y%m')\n" + "end as yearmonth from customer_history ch,\n" + "(select t.customer_id,max(t.change_time) as change_time from customer_history t where t.change_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d') group by t.customer_id ) as temp \n" + "where temp.customer_id=ch.customer_id and temp.change_time=ch.change_time\n" + "and ch.new_status_id is not null and ch.new_status_id=2\n" + "union all\n" + "select count(ch.id) as nums,case when count(ch.id)=0 then date_format(?,'%Y%m')\n" + "else date_format(temp.change_time,'%Y%m')\n" + "end as yearmonth from customer_history ch,\n" + "(select t.customer_id,max(t.change_time) as change_time from customer_history t where t.change_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d') group by t.customer_id ) as temp \n" + "where temp.customer_id=ch.customer_id and temp.change_time=ch.change_time\n" + "and ch.new_status_id is not null and ch.new_status_id=2\n" + "union all\n" + "select count(ch.id) as nums,case when count(ch.id)=0 then date_format(?,'%Y%m')\n" + "else date_format(temp.change_time,'%Y%m')\n" + "end as yearmonth from customer_history ch,\n" + "(select t.customer_id,max(t.change_time) as change_time from customer_history t where t.change_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d') group by t.customer_id ) as temp \n" + "where temp.customer_id=ch.customer_id and temp.change_time=ch.change_time\n" + "and ch.new_status_id is not null and ch.new_status_id=2",lastFirstDay,lastFirstDay,firstDay,firstDay,firstDay,nextFirstDay,nextFirstDay,nextFirstDay,neFirstDay); renderJson(lst); } /*** * 统计上月、本月、下月预计签约的客户 */ public void countExpectSignCustomer(){ List lst = new ArrayList (); String lastFirstDay=DateUtils.getFirstDay(new Date(),-1);//上月第一天 String firstDay=DateUtils.getFirstDay(new Date(),0);//本月第一天 String nextFirstDay=DateUtils.getFirstDay(new Date(),1);//下月第一天 String neFirstDay=DateUtils.getFirstDay(new Date(),2);//下下月第一天 lst=Db.find("select count(t.id) nums,case when count(t.id)=0 then date_format(?,'%Y%m')\n" + "else date_format(t.expect_sign_time,'%Y%m')\n" + "end as yearmonth from customer t where t.status_id<> 3 and t.expect_sign_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d')\n" + "union all\n" + "select count(t.id) nums,case when count(t.id)=0 then date_format(?,'%Y%m')\n" + "else date_format(t.expect_sign_time,'%Y%m')\n" + "end as yearmonth from customer t where t.status_id<> 3 and t.expect_sign_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d')\n" + "union all\n" + "select count(t.id) nums,case when count(t.id)=0 then date_format(?,'%Y%m')\n" + "else date_format(t.expect_sign_time,'%Y%m')\n" + "end as yearmonth from customer t where t.status_id<> 3 and t.expect_sign_time between date_format(?,'%Y%m%d') and date_format(?,'%Y%m%d')",lastFirstDay,lastFirstDay,firstDay,firstDay,firstDay,nextFirstDay,nextFirstDay,nextFirstDay,neFirstDay); renderJson(lst); } }