zhanghj
/
ChengDa_English
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
ChengDa_English/SGGL/FineUIPro.Web/HSSE/HiddenInspection/RiskAnalysisChart.aspx

232 lines
9.6 KiB
Plaintext
Raw Normal View History

20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RiskAnalysisChart.aspx.cs"
Inherits="FineUIPro.Web.HSSE.HiddenInspection.RiskAnalysisChart" %>
<%@ Register Src="~/Controls/ChartControl.ascx" TagName="ChartControl" TagPrefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>巡检分析(图表)</title>
<link href="../../res/css/common.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../../res/index/js/echarts.min.js"></script>
<script type="text/javascript" src="../../res/index/js/jquery-3.4.1.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<f:PageManager ID="PageManager1" runat="server" AutoSizePanelID="RegionPanel1" AjaxAspnetControls="divAccidentUnit,divAccidentTime" />
<f:Panel ID="Panel3" CssClass="blockpanel" runat="server" EnableCollapse="false"
BodyPadding="10px" ShowBorder="true" ShowHeader="false">
<Items>
<f:Form ID="Form2" ShowHeader="false" ShowBorder="false" runat="server">
<Rows>
2023-07-03
2023-07-03 14:46:37 +08:00
<f:FormRow ColumnWidths="15% 15% 15% 2% 15% 30% 15% 10%">
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
<Items>
2023-07-03
2023-07-03 14:46:37 +08:00
<f:DropDownList runat="server" Label="责任单位" ID="drpUnit" LabelWidth="80px" Width="150px"> </f:DropDownList>
<f:DropDownList runat="server" Label="检查项" ID="drpRegisterTypes" LabelWidth="80px" Width="150px"> </f:DropDownList>
<f:DatePicker ID="txtStartRectificationTime" runat="server" Label="检查时间" LabelAlign="Right" Width="100px"
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
LabelWidth="80px">
</f:DatePicker>
<f:Label ID="Label3" runat="server" Text="至" Width="5px">
</f:Label>
2023-07-03
2023-07-03 14:46:37 +08:00
<f:DatePicker ID="txtEndRectificationTime" runat="server" Width="100px">
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
</f:DatePicker>
2023-07-03
2023-07-03 14:46:37 +08:00
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
<f:RadioButtonList ID="rblState" runat="server" Label="分析类型" LabelWidth="80px" Width="250px"
AutoPostBack="true" OnSelectedIndexChanged="drpChartType_SelectedIndexChanged">
<f:RadioItem Value="0" Selected="true" Text="按责任单位" />
首页数据只显示本年份修改
2024-01-03 14:12:27 +08:00
<f:RadioItem Value="2" Text="检查人" />
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
<f:RadioItem Value="1" Text="按检查项" />
首页数据只显示本年份修改
2024-01-03 14:12:27 +08:00
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
</f:RadioButtonList>
<f:Button ID="BtnAnalyse" Text="统计" Icon="ChartPie" runat="server" OnClick="BtnAnalyse_Click">
</f:Button>
</Items>
</f:FormRow>
</Rows>
</f:Form>
</Items>
</f:Panel>
<f:Panel ID="Panel4" CssClass="blockpanel" runat="server" EnableCollapse="false" MarginTop="10px"
BodyPadding="10px" ShowBorder="true" ShowHeader="false">
<Items>
升级
2024-01-29 18:34:54 +08:00
<f:TabStrip ID="TabStrip1" CssClass="f-tabstrip-theme-simple" Height="700px" ShowBorder="true"
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
TabPosition="Top" MarginBottom="5px" EnableTabCloseMenu="false" runat="server">
<Tabs>
20230922
2023-09-22 17:36:00 +08:00
<f:Tab ID="Tab2" Title="按类别" BodyPadding="5px" Layout="Fit" IconFont="Bookmark" runat="server"
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
TitleToolTip="按类别统计">
<Items>
20230922
2023-09-22 17:36:00 +08:00
<f:Panel ID="Panel2" IsFluid="true" runat="server" Height="350px" ShowBorder="true" EnableCollapse="false"
Layout="HBox" ShowHeader="false" >
<Items>
<f:ContentPanel ShowHeader="false" runat="server" ID="cpAccidentTime" Margin="0 0 0 0" BoxFlex="2" >
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
20230922
2023-09-22 17:36:00 +08:00
<div id="divAccidentTime" style=" height: 700px; ">
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
20230922
2023-09-22 17:36:00 +08:00
</div>
</f:ContentPanel>
升级
2024-01-29 18:34:54 +08:00
</Items>
</f:Panel>
</Items>
</f:Tab>
<f:Tab ID="Tab1" Title="按类别饼图" BodyPadding="5px" Layout="Fit" IconFont="Bookmark" runat="server"
TitleToolTip="按类别统计">
<Items>
<f:Panel ID="Panel1" IsFluid="true" runat="server" Height="350px" ShowBorder="true" EnableCollapse="false"
Layout="HBox" ShowHeader="false" >
<Items>
<f:ContentPanel ShowHeader="false" runat="server" ID="ContentPanel3" Margin="0 0 0 0 " BoxFlex="1" >
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
升级
2024-01-29 18:34:54 +08:00
<div id="divPie" style="height: 700px;width:1000px;" >
20230922
2023-09-22 17:36:00 +08:00
</div>
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
20230922
2023-09-22 17:36:00 +08:00
</f:ContentPanel>
</Items>
</f:Panel>
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
</Items>
升级
2024-01-29 18:34:54 +08:00
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
</f:Tab>
</Tabs>
</f:TabStrip>
</Items>
</f:Panel>
</form>
</body>
<script language="javascript">
升级
2024-01-29 18:34:54 +08:00
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
function rendChart(legend, xAxis, series) {
option = {
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器，坐标轴触发有效
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},
legend: {
data: legend
},
grid: {
left: '3%',
right: '4%',
20230229
2023-08-29 18:56:49 +08:00
bottom: '15%',
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
containLabel: true
},
xAxis: [
{
20230922
2023-09-22 17:36:00 +08:00
axisLabel: { interval: 0 },
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
type: 'category',
data: xAxis
}
],
yAxis: [
{
type: 'value'
}
],
series: series
};
20230922
2023-09-22 17:36:00 +08:00
首页数据只显示本年份修改
2024-01-03 14:12:27 +08:00
//if (xAxis.length > 5) {
// option.dataZoom = [{
// type: 'slider',
// show: true,
// startValue: 0,
// endValue: 4,
// height: '10',
// backgroundColor: '#aed0ea',
// fillerColor: '#107f8b',
// bottom: '10%',
// zoomLock: true,
// moveOnMouseWheel: true,
// brushSelect: true,
// showDetail: false,
// }]
//}
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
var myChart = echarts.init(document.getElementById("divAccidentTime"));
myChart.setOption(option);
}
20230229
2023-08-29 18:56:49 +08:00
20230922
2023-09-22 17:36:00 +08:00
function pie( title, xArr, data) {
升级
2024-01-29 18:34:54 +08:00
20230922
2023-09-22 17:36:00 +08:00
// 基于准备好的dom，初始化echarts实例
var myChartpie = echarts.init(document.getElementById("divPie"))
// 指定图表的配置项和数据
var option = {
title: [{
text: title,
bottom: '0',
left: 'center',
textStyle: {
color: '#fff',
fontSize: 12,
fontWeight: 300
}
}],
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c} ({d})'
},
legend: {
show: true,
left: 'top',
top: 'top',
align: 'left',
data: xArr,
},
color: ['#1D9A78', '#8BC145', '#36AFCE', '#1D6FA9'],
series: [
{
name: title,
type: 'pie',
center: ['50%', '50%'],
radius: ['40%', '70%'],
avoidLabelOverlap: false,
label: {
show: true,
textStyle: {
color: '#333'
},
position: 'inside',
formatter: function (data) { return data.percent.toFixed(0) + ""; }
},
labelLine: {
show: false
},
data: data,
itemStyle: {
normal: {
//opacity: 0.7,
borderWidth: 3,
borderColor: 'rgba(218,235,234, 1)'
}
}
}
]
}
// 使用刚指定的配置项和数据显示图表。
myChartpie.setOption(option)
}
$(document).ready(function () {
升级
2024-01-29 18:34:54 +08:00
setTimeout(function () {
$("#divPie").width ( $("#divAccidentTime").width());
20230922
2023-09-22 17:36:00 +08:00
pie('', <%=xPieAxis%>, <%=seriesPie%>);
rendChart(<%=legend%>,<%=xAxis%>,<%=series%>);
}, 1000);
});
20220315 代码初始化上传
2022-03-15 17:36:38 +08:00
</script>
</html>