从第一篇的博客到现在已经有一年了，请原谅我的懒惰一年中只写了一篇

来源：互联网发布：对网络语言的看法20字编辑：程序博客网时间：2024/05/03 11:20

在这一年中，从毕业到工作，这段事件也刚刚好一年了，在一年中里面，也见识了很多，了解了很多，长话短说；

我把从过年回来到现在这半个月的时间技术总结一下，因为我过年回来的比较晚，所以被借调到别的部门进行开发，在这段开发的时间里面，我主要负责前台，前台主要用到技术是jquery eazyui，还有一个是amcharts

我先总结一下amcharts，我了解amcharts是从官网下载它的API和在网上找资料一下是他的代码部分；

//折线图

   $.ajax({
url: 'analysisController.do?analysis',
type: 'POST',
data:{type:"xdjqynt"},
dataType: 'json',
timeout: 3000,
complete : function(XMLHttpRequest,status){ //请求完成后最终执行参数
　　　　if(status=='timeout'){//超时,status还有success,error等值的情况
　　　　　 ajaxTimeoutTest.abort();
　　　　　 alert("超时");
　　　　}
　　},
success: function(result){
if(result.isSuccess){
chartData = result.obj;
xdjqyntChart(chartData);
}
}

});

function xdjqyntChart(chartData){
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.dataProvider = chartData;
chart.categoryField = "year"; //横坐标年份
chart.startDuration = 0.5;
chart.balloon.color = "#000000";

// AXES
// category
var categoryAxis = chart.categoryAxis;//创建一个折线图
categoryAxis.fillAlpha = 1;
categoryAxis.fillColor = "#FAFAFA"; //填充颜色
categoryAxis.gridAlpha = 0;
categoryAxis.axisAlpha = 0;
categoryAxis.gridPosition = "start";
//categoryAxis.position = "top";

// value
var valueAxis = new AmCharts.ValueAxis();
valueAxis.title = "企业数(户)";
valueAxis.dashLength = 5;
valueAxis.axisAlpha = 0;
valueAxis.minimum = 1;
valueAxis.maximum =1000;
valueAxis.integersOnly = true;
valueAxis.gridCount = 10;
valueAxis.reversed = false; // this line makes the value axis reversed
chart.addValueAxis(valueAxis);

// GRAPHS
// Italy graph
var graph = new AmCharts.AmGraph();
graph.title = "Italy";
graph.valueField = "italy";
graph.hidden = true; // this line makes the graph initially hidden
graph.balloonText = "place taken by Italy in [[category]]: [[value]]";
graph.lineAlpha = 1;
graph.bullet = "round";
//chart.addGraph(graph);

// Germany graph
var graph = new AmCharts.AmGraph();
graph.title = "Germany";
graph.valueField = "germany";
graph.balloonText = "place taken by Germany in [[category]]: [[value]]";
graph.bullet = "round";
//chart.addGraph(graph);

// United Kingdom graph
var graph = new AmCharts.AmGraph();
graph.title = "年度新登记企业";
graph.valueField = "total"; //纵坐标
graph.balloonText = "[[category]]年新登记的企业数为: [[value]]户"; //当鼠标移到折线上面显示出来的数据
graph.bullet = "round";
chart.addGraph(graph);

// CURSOR
var chartCursor = new AmCharts.ChartCursor();
chartCursor.cursorPosition = "mouse";
chartCursor.zoomable = false;
chartCursor.cursorAlpha = 0;
chart.addChartCursor(chartCursor);

// LEGEND
var legend = new AmCharts.AmLegend();
legend.useGraphSettings = true;
chart.addLegend(legend);

// WRITE
chart.write("chartdiv02");
}

//柱状图
$.ajax({
url: 'analysisController.do?analysis',
type: 'POST',
data:{type:"cyqy"},
dataType: 'json',
timeout: 3000,
complete : function(XMLHttpRequest,status){ //请求完成后最终执行参数
　　　　if(status=='timeout'){//超时,status还有success,error等值的情况
　　　　　 ajaxTimeoutTest.abort();
　　　　　 alert("超时");
　　　　}
　　},
success: function(result){
if(result.isSuccess){
chartData = result.obj;
hyfb(chartData);
}
}
});

function hyfb(chartData){
var chart = AmCharts.makeChart("chartdiv02", {
type: "serial",
dataProvider: chartData,
categoryField: "codename",
pathToImages:"amcharts/images/",
depth3D: 20,
angle: 30,
categoryAxis: {
labelRotation: 40,
autoGridCount:false,
gridCount:chartData.length,
gridPosition: "start"
},

valueAxes: [{
title: "企业数（户）"
}],

graphs: [{
valueField: "count(*)",
colorField: "color",
type: "column",
balloonText:"[[category]]: <b>[[value]]</b>",
lineAlpha: 1,
fillAlphas: 1
}],

chartCursor: {
cursorAlpha: 0,
zoomable: false,
categoryBalloonEnabled: false
},

amExport: {
top: 21,
right: 21,
buttonColor: '#EFEFEF',
buttonRollOverColor:'#DDDDDD',
exportPNG:true,
exportJPG:true,
exportPDF:true,
exportSVG:true
}
});
}

如果柱状图横坐标的参数过多可以在categoryAxis加上这两个属性 autoGridCount:false, gridCount:chartData.length

jquery eazyUI

combobox下拉框联动：

这个下拉框联动请求后台返回前台一个JSON字符串，当选择一个下拉框里面的值时触发第二个下拉框，第二个下拉框相应的根据一个传回来的Id，到后台去找相应的方法，返回来的值就是第二个下拉框的值，一次类推；

下拉框绑定事件

$('#pagePage3_dataItemName').combobox('textbox').bind('focus',function(){

});

0 0