var code = "";
|
var resultData = null;
|
var maxTime="";
|
var title = "";
|
;
|
new CusScrollBar({
|
contentSelector: '.scroll_cont1', //滚动内容区
|
barSelector: '.scroll_bar1', //滚动条
|
sliderSelector: '.scroll_slider1' //滚动滑块
|
});
|
window.onload = function () {
|
maxTime = getUrlParam("MaxTime");
|
title =decodeURI(decodeURI(getUrlParam("title")));
|
if (maxTime != null & maxTime != "") {
|
GetData(maxTime,title);
|
}
|
btnClick();
|
}
|
|
function GetData(Year, title) {
|
var dataLegend = [];
|
var dataY1 = [];
|
var dataY2 = [];
|
var TableName = getUrlParam("type");//localStorage.getItem("type");
|
var TableColor =GetCmpareTable(TableName);
|
var html = "";
|
$.ajax({
|
url: "../../../Ashx/Secondcommon.ashx",
|
type: "post",
|
data: { Action: "GetAllSumData", dataTable: TableName, colorTable: TableColor },
|
dataType: "json",
|
async: false,
|
success: function (result) {
|
var Name = "";
|
for (var i = 0; i < result.length; i++) {
|
if (result[i].fr.length == 2) {
|
Name = result[i].Name;
|
break;
|
}
|
}
|
resultData = result;
|
if (resultData != null) {
|
var count = 0;
|
$.each(result, function (index, Rsvalue) {
|
var R = Rsvalue.R;
|
var G = Rsvalue.G;
|
var B = Rsvalue.B;
|
var pieItem = new obj();
|
var itemColor = new col();
|
var clkVal = new clk();
|
if (Rsvalue.Year == Year) {
|
html += "<tr style='background-color:rgb(" + Rsvalue.R + "," + Rsvalue.G + "," + Rsvalue.B + ");'><td>" + Rsvalue.Name + "</td><td>" + parseFloat(Rsvalue.Area).toFixed(2) + "</td></tr>";
|
if (Rsvalue.Name == Name) {
|
code = Rsvalue.fr;
|
}
|
if (Rsvalue.fr.length > 2 & Rsvalue.fr.substring(0, 2)==code) {
|
|
count++;
|
//if (count == 1) {
|
// pieItem.value = Rsvalue.Area;
|
// pieItem.name = Rsvalue.Name;
|
// pieItem.selected = true;
|
// itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
// pieItem.itemStyle = itemColor;
|
// pieItem.label = clkVal;
|
// dataY1.push(pieItem);
|
//} else {
|
pieItem.value =parseFloat(Rsvalue.Area).toFixed(2);
|
pieItem.name = Rsvalue.Name;
|
itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
pieItem.itemStyle = itemColor;
|
dataY1.push(pieItem);
|
// }
|
|
}
|
if (Rsvalue.fr.length==2) {
|
dataLegend.push(Rsvalue.Name);
|
//if (Rsvalue.Name == Name) {
|
// pieItem.value = Rsvalue.Area;
|
// pieItem.name = Rsvalue.Name;
|
// //pieItem.selected = true;
|
// itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
// pieItem.itemStyle = itemColor;
|
// pieItem.label = clkVal;
|
// dataY2.push(pieItem);
|
//} else {
|
pieItem.value = Rsvalue.Area;
|
pieItem.name = Rsvalue.Name;
|
itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
pieItem.itemStyle = itemColor;
|
dataY2.push(pieItem);
|
// }
|
}
|
}
|
})
|
|
InitChart(maxTime + title, dataLegend, dataY1, dataY2);
|
$(".scroll_cont1 table").empty();
|
$(".scroll_cont1 table").append("<tr><td>名称</td><td>面积</td></tr>" + html);
|
}
|
|
}
|
});
|
|
}
|
|
function InitChart(title, dataLegend, dataY1, dataY2) {
|
dataY1 = uniq(dataY1);
|
|
var dom = document.getElementById("container");
|
var myChart = echarts.init(dom);
|
|
option = null;
|
option = {
|
//title:{
|
// text: title,
|
// x:'center',
|
// y:'top',
|
// top:'20',
|
// textStyle: {
|
// color: '#ffffff',
|
// fontWeight: 'normal',
|
// fontSize:15
|
// }
|
//},
|
tooltip: {
|
trigger: 'item',
|
confine: 'hidden',
|
formatter: '{a} <br/>{b}: {c} ({d}%)'
|
},
|
legend: {
|
orient: 'horizontal',
|
bottom: '10',
|
textStyle: {
|
color:'#ffffff'
|
},
|
icon: "circle",
|
itemWidth: 15,
|
itemHeight: 15,
|
data:dataLegend
|
},
|
series: [
|
|
{
|
center: ["50%", "35%"],
|
name: '面积',
|
type: 'pie',
|
selectedMode: 'single',
|
radius: [0, '20%'],
|
label: {
|
normal: {
|
position: 'inner',
|
show: false,
|
color:'#ffffff'
|
}
|
|
},
|
labelLine: {
|
show: false
|
},
|
data: dataY1
|
|
},
|
{
|
center: ["50%", "35%"],
|
name: '面积',
|
type: 'pie',
|
radius: ['30%', '45%'],
|
label: {
|
show: false,
|
position: 'center'
|
},
|
|
labelLine: {
|
show: false
|
},
|
data: dataY2
|
}
|
]
|
};;
|
if (option && typeof option === "object") {
|
|
myChart.setOption(option, true);
|
};
|
|
myChart.on('click', function (params) {
|
// 当componentType == "xAxis"或者 ==“yAxisx”时，取被点击时坐标轴的值params.value
|
if (params.seriesIndex == 1&dataY1!="") {
|
myChart.dispose();
|
GetClickData(params.name, maxTime);
|
}
|
|
});
|
}
|
|
|
var obj = function (val, Nam) {
|
return {
|
value: val,
|
name: Nam,
|
//selected: selectState,
|
itemStyle: col,
|
label:clk
|
}
|
|
}
|
|
|
var col = function (colorRgb) {
|
return {
|
color: colorRgb
|
}
|
}
|
//点中的显示
|
var clk = function () {
|
return {
|
show: 'true'
|
|
}
|
}
|
|
|
|
//点击模块
|
function GetClickData(Name, Year) {
|
var dataLegend = [];
|
var dataY1 = [];
|
var dataY2 = [];
|
var code = "";
|
if (resultData != null) {
|
var count = 0;
|
$.each(resultData, function (index, Rsvalue) {
|
var R = Rsvalue.R;
|
var G = Rsvalue.G;
|
var B = Rsvalue.B;
|
|
//year = Rsvalue.Year;
|
var pieItem = new obj();
|
var itemColor = new col();
|
var clkVal = new clk();
|
if (Rsvalue.Year == Year) {
|
if (Rsvalue.Name == Name) {
|
code = Rsvalue.fr;
|
}
|
if (Rsvalue.fr.length > 2 & Rsvalue.fr.substring(0, 2) == code) {
|
// count++;
|
//if (count == 1) {
|
// pieItem.value = Rsvalue.Area;
|
// pieItem.name = Rsvalue.Name;
|
// pieItem.selected = true;
|
// itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
// pieItem.itemStyle = itemColor;
|
// dataY1.push(pieItem);
|
//} else {
|
pieItem.value = Rsvalue.Area;
|
pieItem.name = Rsvalue.Name;
|
itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
pieItem.itemStyle = itemColor;
|
pieItem.label = clkVal;
|
dataY1.push(pieItem);
|
//}
|
|
}
|
if (Rsvalue.fr.length == 2) {
|
dataLegend.push(Rsvalue.Name);
|
//if (Rsvalue.Name == Name) {
|
// pieItem.value = Rsvalue.Area;
|
// pieItem.name = Rsvalue.Name;
|
// pieItem.selected = true;
|
// itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
// pieItem.itemStyle = itemColor;
|
// pieItem.label = clkVal;
|
// dataY2.push(pieItem);
|
//} else {
|
pieItem.value = Rsvalue.Area;
|
pieItem.name = Rsvalue.Name;
|
itemColor.color = "rgb(" + R + "," + G + "," + B + ")";
|
pieItem.itemStyle = itemColor;
|
dataY2.push(pieItem);
|
// }
|
}
|
}
|
|
});
|
InitChart(maxTime+title, dataLegend, dataY1, dataY2);
|
}
|
|
}
|
|
function uniq(array) {
|
var temp = []; //一个新的临时数组
|
for (var i = 0; i < array.length; i++) {
|
if (temp.indexOf(array[i]) == -1) {
|
temp.push(array[i]);
|
}
|
}
|
return temp;
|
}
|
|
function btnClick() {
|
$(".chartBtn").click(function () {
|
$("#container").css("display", "block");
|
$("#dataTable").css("display", "none");
|
$(".dataBtn").css("background-color", "#000000");
|
$(".chartBtn").css("background-color", "#033D73");
|
});
|
|
$(".dataBtn").click(function () {
|
$("#container").css("display", "none");
|
$("#dataTable").css("display", "block");
|
$(".dataBtn").css("background-color", "#033D73");
|
$(".chartBtn").css("background-color", "#000000");
|
});
|
}
|
