547 lines
20 KiB
HTML
547 lines
20 KiB
HTML
<div style="width:100%;height:5%;">
|
||
<div style="margin-left:10px;margin-top:5px">
|
||
<form id="fxfxf">
|
||
<label>责任部门</label><input id="szrbm" name="zrbm" style="width:200px;height:22px" />
|
||
<a onclick="fxsearch()" class='easyui-linkbutton' iconCls='fa-search' plain=true>查询</a></form>
|
||
</div>
|
||
</div>
|
||
<div align=center>
|
||
<div id="fxdlxt" style="width:80%;height:600px;">
|
||
|
||
</div>
|
||
|
||
<div id="fxdjbt" style="width:80%;height:600px;">
|
||
|
||
</div>
|
||
|
||
<div id="fxjbt" style="width:80%;height:600px;">
|
||
</div>
|
||
</div>
|
||
<div id="fxdqyt" style="width:100%;height:600px;padding: 20px">
|
||
</div>
|
||
|
||
<script>
|
||
$("#szrbm").combotree({
|
||
url: 'parthandle?a=tree',
|
||
editable: false,
|
||
loadFilter: function (rows) {
|
||
return convert(rows);
|
||
},
|
||
formatter: function (node) {
|
||
var s = node.text;
|
||
if (node.children) {
|
||
s += ' <span style=\'color:blue\'>(' + node.children.length + ')</span>';
|
||
}
|
||
return s;
|
||
},
|
||
onSelect: function (node) {
|
||
// $('#sfxr').combobox({
|
||
// url: 'getuser?partid=' + node.id + '&a=combobox',
|
||
// editable: false,
|
||
// });
|
||
}
|
||
});
|
||
// function fxrpmsearch() {
|
||
// var querydata = $('#fxrpms').serializeJSON();
|
||
// $('#fxrpmtable').datagrid('load', querydata);
|
||
// }
|
||
// function zgrpmsearch() {
|
||
// var querydata = $('#zgrpms').serializeJSON();
|
||
// $('#zgrpmtable').datagrid('load', querydata);
|
||
// }
|
||
function fxsearch() {
|
||
var querydata = $('#fxfxf').serializeJSON();
|
||
bindmap_fxdlxt('fxdlxt',querydata);
|
||
bindmap_fxdjbt('fxdjbt',querydata);
|
||
bindmap_fxjbt('fxjbt',querydata);
|
||
bindmap_fxdqyt('fxdqyt',querydata);
|
||
}
|
||
var now = new Date();
|
||
var year = now.getFullYear();
|
||
var month = now.getMonth() + 1;
|
||
bindmap_fxdlxt('fxdlxt');
|
||
bindmap_fxdjbt('fxdjbt');
|
||
bindmap_fxjbt('fxjbt');
|
||
bindmap_fxdqyt('fxdqyt');
|
||
function bindmap_fxdjbt(x, querydata) {
|
||
|
||
var querydata = querydata || {}
|
||
let myChart
|
||
myChart = echarts.init(document.getElementById(x));
|
||
myChart.setOption(option = {
|
||
title: {
|
||
text: '风险点级别分布图',
|
||
},
|
||
legend: {
|
||
x: 'center',
|
||
y: 'bottom',
|
||
data: []
|
||
},
|
||
tooltip: {
|
||
trigger: 'item',
|
||
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
||
},
|
||
toolbox: {
|
||
show: true,
|
||
feature: {
|
||
mark: { show: true },
|
||
restore: { show: true },
|
||
saveAsImage: { show: true },
|
||
dataView: { show: true, readOnly: false },
|
||
//magicType: { show: true, type: ['line', 'bar'] },
|
||
}
|
||
},
|
||
color:['blue', 'yellow','orange','red'],
|
||
series: [
|
||
{
|
||
name: '风险点级别',
|
||
type: 'pie',
|
||
radius: '70%',
|
||
center: ['50%', '50%'],
|
||
data: [
|
||
],
|
||
label: {
|
||
normal: {
|
||
formatter: '{a|{a}}{abg|}\n{hr|}\n {b|{b}：}{c} {per|{d}%} ',
|
||
backgroundColor: '#eee',
|
||
borderColor: '#aaa',
|
||
borderWidth: 1,
|
||
borderRadius: 4,
|
||
// shadowBlur:3,
|
||
// shadowOffsetX: 2,
|
||
// shadowOffsetY: 2,
|
||
// shadowColor: '#999',
|
||
// padding: [0, 7],
|
||
rich: {
|
||
a: {
|
||
color: '#999',
|
||
lineHeight: 22,
|
||
align: 'center'
|
||
},
|
||
hr: {
|
||
borderColor: '#aaa',
|
||
width: '100%',
|
||
borderWidth: 0.5,
|
||
height: 0
|
||
},
|
||
b: {
|
||
fontSize: 16,
|
||
lineHeight: 33
|
||
},
|
||
per: {
|
||
color: '#eee',
|
||
backgroundColor: '#334455',
|
||
padding: [2, 4],
|
||
borderRadius: 2
|
||
}
|
||
}
|
||
}
|
||
},
|
||
}
|
||
]
|
||
});
|
||
myChart.showLoading();
|
||
|
||
$.ajax({
|
||
type: "get",
|
||
async: true, //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行）
|
||
url: "api/riskas?a=fxdjbt", //请求发送
|
||
data: querydata,
|
||
dataType: "json", //返回数据形式为json
|
||
success: function (data) {
|
||
//请求成功时执行该函数内容，data即为服务器返回的json对象
|
||
if (data) {
|
||
myChart.hideLoading(); //隐藏加载动画
|
||
myChart.setOption(
|
||
{
|
||
legend: [{
|
||
data: data.legendData,
|
||
}],
|
||
series: [
|
||
{
|
||
data: data.seriesData,
|
||
}
|
||
]
|
||
}
|
||
);
|
||
//map4v=myChart.getDataURL();
|
||
}
|
||
},
|
||
error: function (errorMsg) {
|
||
//请求失败时执行该函数
|
||
//alert("汗,没有数据吧!");
|
||
myChart.hideLoading();
|
||
}
|
||
});
|
||
}
|
||
function bindmap_fxdlxt(x, querydata) {
|
||
|
||
var querydata = querydata || {}
|
||
let myChart
|
||
myChart = echarts.init(document.getElementById(x));
|
||
myChart.setOption(option = {
|
||
title: {
|
||
text: '风险点类型分布图',
|
||
},
|
||
legend: {
|
||
x: 'center',
|
||
y: 'bottom',
|
||
data: []
|
||
},
|
||
tooltip: {
|
||
trigger: 'item',
|
||
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
||
},
|
||
toolbox: {
|
||
show: true,
|
||
feature: {
|
||
mark: { show: true },
|
||
restore: { show: true },
|
||
saveAsImage: { show: true },
|
||
dataView: { show: true, readOnly: false },
|
||
//magicType: { show: true, type: ['line', 'bar'] },
|
||
}
|
||
},
|
||
series: [
|
||
{
|
||
name: '风险点类型',
|
||
type: 'pie',
|
||
radius: '70%',
|
||
center: ['50%', '50%'],
|
||
data: [
|
||
],
|
||
label: {
|
||
normal: {
|
||
formatter: '{a|{a}}{abg|}\n{hr|}\n {b|{b}：}{c} {per|{d}%} ',
|
||
backgroundColor: '#eee',
|
||
borderColor: '#aaa',
|
||
borderWidth: 1,
|
||
borderRadius: 4,
|
||
// shadowBlur:3,
|
||
// shadowOffsetX: 2,
|
||
// shadowOffsetY: 2,
|
||
// shadowColor: '#999',
|
||
// padding: [0, 7],
|
||
rich: {
|
||
a: {
|
||
color: '#999',
|
||
lineHeight: 22,
|
||
align: 'center'
|
||
},
|
||
hr: {
|
||
borderColor: '#aaa',
|
||
width: '100%',
|
||
borderWidth: 0.5,
|
||
height: 0
|
||
},
|
||
b: {
|
||
fontSize: 16,
|
||
lineHeight: 33
|
||
},
|
||
per: {
|
||
color: '#eee',
|
||
backgroundColor: '#334455',
|
||
padding: [2, 4],
|
||
borderRadius: 2
|
||
}
|
||
}
|
||
}
|
||
},
|
||
}
|
||
]
|
||
});
|
||
myChart.showLoading();
|
||
|
||
$.ajax({
|
||
type: "get",
|
||
async: true, //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行）
|
||
url: "api/riskas?a=fxdlxt", //请求发送
|
||
data: querydata,
|
||
dataType: "json", //返回数据形式为json
|
||
success: function (data) {
|
||
//请求成功时执行该函数内容，data即为服务器返回的json对象
|
||
if (data) {
|
||
myChart.hideLoading(); //隐藏加载动画
|
||
myChart.setOption(
|
||
{
|
||
legend: [{
|
||
data: data.legendData,
|
||
}],
|
||
series: [
|
||
{
|
||
data: data.seriesData,
|
||
}
|
||
]
|
||
}
|
||
);
|
||
//map4v=myChart.getDataURL();
|
||
}
|
||
},
|
||
error: function (errorMsg) {
|
||
//请求失败时执行该函数
|
||
//alert("汗,没有数据吧!");
|
||
myChart.hideLoading();
|
||
}
|
||
});
|
||
}
|
||
function bindmap_fxjbt(x, querydata) {
|
||
|
||
var querydata = querydata || {}
|
||
let myChart
|
||
myChart = echarts.init(document.getElementById(x));
|
||
myChart.setOption(option = {
|
||
title: {
|
||
text: '风险级别分布图',
|
||
},
|
||
legend: {
|
||
x: 'center',
|
||
y: 'bottom',
|
||
data: []
|
||
},
|
||
|
||
color: ['blue', 'yellow', 'orange', 'red'],
|
||
|
||
tooltip: {
|
||
trigger: 'item',
|
||
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
||
},
|
||
toolbox: {
|
||
show: true,
|
||
feature: {
|
||
mark: { show: true },
|
||
restore: { show: true },
|
||
saveAsImage: { show: true },
|
||
dataView: { show: true, readOnly: false },
|
||
//magicType: { show: true, type: ['line', 'bar'] },
|
||
}
|
||
},
|
||
series: [
|
||
{
|
||
name: '风险级别',
|
||
type: 'pie',
|
||
radius: '70%',
|
||
center: ['50%', '50%'],
|
||
data: [
|
||
],
|
||
label: {
|
||
normal: {
|
||
formatter: '{a|{a}}{abg|}\n{hr|}\n {b|{b}：}{c} {per|{d}%} ',
|
||
backgroundColor: '#eee',
|
||
borderColor: '#aaa',
|
||
borderWidth: 1,
|
||
borderRadius: 4,
|
||
// shadowBlur:3,
|
||
// shadowOffsetX: 2,
|
||
// shadowOffsetY: 2,
|
||
// shadowColor: '#999',
|
||
// padding: [0, 7],
|
||
rich: {
|
||
a: {
|
||
color: '#999',
|
||
lineHeight: 22,
|
||
align: 'center'
|
||
},
|
||
hr: {
|
||
borderColor: '#aaa',
|
||
width: '100%',
|
||
borderWidth: 0.5,
|
||
height: 0
|
||
},
|
||
b: {
|
||
fontSize: 16,
|
||
lineHeight: 33
|
||
},
|
||
per: {
|
||
color: '#eee',
|
||
backgroundColor: '#334455',
|
||
padding: [2, 4],
|
||
borderRadius: 2
|
||
}
|
||
}
|
||
}
|
||
},
|
||
}
|
||
]
|
||
});
|
||
myChart.showLoading();
|
||
|
||
$.ajax({
|
||
type: "get",
|
||
async: true, //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行）
|
||
url: "api/riskas?a=fxjbt", //请求发送
|
||
data: querydata,
|
||
dataType: "json", //返回数据形式为json
|
||
success: function (data) {
|
||
//请求成功时执行该函数内容，data即为服务器返回的json对象
|
||
if (data) {
|
||
myChart.hideLoading(); //隐藏加载动画
|
||
myChart.setOption(
|
||
{
|
||
legend: [{
|
||
data: data.legendData,
|
||
}],
|
||
series: [
|
||
{
|
||
data: data.seriesData,
|
||
}
|
||
]
|
||
}
|
||
);
|
||
//map4v=myChart.getDataURL();
|
||
}
|
||
},
|
||
error: function (errorMsg) {
|
||
//请求失败时执行该函数
|
||
//alert("汗,没有数据吧!");
|
||
myChart.hideLoading();
|
||
}
|
||
});
|
||
}
|
||
function bindmap_fxdqyt(x, querydata) {
|
||
var querydata = querydata || {}
|
||
let myChart
|
||
myChart = echarts.init(document.getElementById(x));
|
||
myChart.setOption(option = {
|
||
title: {
|
||
text: '区域风险分布图',
|
||
},
|
||
legend: {
|
||
data: ['风险点','低风险点','一般风险点','较大风险点','重大风险点','风险','低风险','一般风险','较大风险','重大风险']
|
||
},
|
||
toolbox: {
|
||
show: true,
|
||
feature: {
|
||
mark: { show: true },
|
||
restore: { show: true },
|
||
saveAsImage: { show: true },
|
||
dataView: { show: true, readOnly: false },
|
||
//magicType: { show: true, type: ['line', 'bar'] },
|
||
}
|
||
},
|
||
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
axisPointer: { // 坐标轴指示器，坐标轴触发有效
|
||
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
||
}
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
data: [],
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
},
|
||
series: [],
|
||
dataZoom: [
|
||
{
|
||
type: 'slider',
|
||
show: true,
|
||
start: 0,
|
||
end: 10,
|
||
handleSize: 8
|
||
},
|
||
{
|
||
type: 'inside',
|
||
start: 94,
|
||
end: 100
|
||
},
|
||
{
|
||
type: 'slider',
|
||
show: true,
|
||
yAxisIndex: 0,
|
||
filterMode: 'empty',
|
||
width: 12,
|
||
height: '70%',
|
||
handleSize: 8,
|
||
showDataShadow: false,
|
||
left: '93%'
|
||
}
|
||
]
|
||
});
|
||
myChart.showLoading();
|
||
$.ajax({
|
||
type: "get",
|
||
async: true, //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行）
|
||
url: "api/riskas?a=fxdqyt", //请求发送
|
||
data: querydata,
|
||
dataType: "json", //返回数据形式为json
|
||
success: function (data) {
|
||
//请求成功时执行该函数内容，data即为服务器返回的json对象
|
||
if (data) {
|
||
myChart.hideLoading(); //隐藏加载动画
|
||
myChart.setOption({
|
||
xAxis: {
|
||
data: data.xAxisData
|
||
},
|
||
series: [{
|
||
name: '风险点',
|
||
type:'bar',
|
||
|
||
data: data.seriesData.datariskact
|
||
},{
|
||
name: '低风险点',
|
||
type:'bar',
|
||
stack: '风险点',
|
||
color: 'blue',
|
||
data: data.seriesData.datariskact1
|
||
},
|
||
{
|
||
name: '一般风险点',
|
||
type:'bar',
|
||
stack: '风险点',
|
||
color: 'yellow',
|
||
data: data.seriesData.datariskact2
|
||
},{
|
||
name: '较大风险点',
|
||
type:'bar',
|
||
stack: '风险点',
|
||
color: 'orange',
|
||
data: data.seriesData.datariskact3
|
||
},{
|
||
name: '重大风险点',
|
||
type:'bar',
|
||
stack: '风险点',
|
||
color: 'red',
|
||
data: data.seriesData.datariskact4
|
||
},{
|
||
name: '风险',
|
||
type:'bar',
|
||
data: data.seriesData.datarisk
|
||
},{
|
||
name: '低风险',
|
||
type:'bar',
|
||
stack: '风险',
|
||
color: 'blue',
|
||
data: data.seriesData.datarisk1
|
||
},{
|
||
name: '一般风险',
|
||
type:'bar',
|
||
stack: '风险',
|
||
color: 'yellow',
|
||
data: data.seriesData.datarisk2
|
||
},{
|
||
name: '较大风险',
|
||
type:'bar',
|
||
stack: '风险',
|
||
color: 'orange',
|
||
data: data.seriesData.datarisk3
|
||
},{
|
||
name: '重大风险',
|
||
type:'bar',
|
||
stack: '风险',
|
||
color: 'red',
|
||
data: data.seriesData.datarisk4
|
||
},]
|
||
});
|
||
//map4v=myChart.getDataURL();
|
||
}
|
||
},
|
||
error: function (errorMsg) {
|
||
//请求失败时执行该函数
|
||
//alert("汗,没有数据吧!");
|
||
myChart.hideLoading();
|
||
}
|
||
});
|
||
}
|
||
</script> |