144 lines
5.7 KiB
Plaintext
144 lines
5.7 KiB
Plaintext
|
<%@ 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>
|
||
|
|
<f:FormRow ColumnWidths="20% 3% 20% 30% 15% 10%">
|
||
|
|
<Items>
|
||
|
|
<f:DatePicker ID="txtStartRectificationTime" runat="server" Label="检查时间" LabelAlign="Right"
|
||
|
|
LabelWidth="80px">
|
||
|
|
</f:DatePicker>
|
||
|
|
<f:Label ID="Label3" runat="server" Text="至" Width="5px">
|
||
|
|
</f:Label>
|
||
|
|
<f:DatePicker ID="txtEndRectificationTime" runat="server">
|
||
|
|
</f:DatePicker>
|
||
|
|
<f:RadioButtonList ID="rblState" runat="server" Label="分析类型" LabelWidth="80px" Width="250px"
|
||
|
|
AutoPostBack="true" OnSelectedIndexChanged="drpChartType_SelectedIndexChanged">
|
||
|
|
<f:RadioItem Value="0" Selected="true" Text="按责任单位" />
|
||
|
|
<f:RadioItem Value="1" Text="按检查项" />
|
||
|
|
</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>
|
||
|
|
<f:TabStrip ID="TabStrip1" CssClass="f-tabstrip-theme-simple" Height="600px" ShowBorder="true"
|
||
|
|
TabPosition="Top" MarginBottom="5px" EnableTabCloseMenu="false" runat="server">
|
||
|
|
<Tabs>
|
||
|
|
<f:Tab ID="Tab2" Title="按类别" BodyPadding="5px" Layout="Fit" IconFont="Bookmark" runat="server"
|
||
|
|
TitleToolTip="按类别统计">
|
||
|
|
<Items>
|
||
|
|
<f:ContentPanel ShowHeader="false" runat="server" ID="cpAccidentTime" Margin="0 0 0 0" >
|
||
|
|
|
||
|
|
<div id="divAccidentTime" style=" height: 550px;">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</f:ContentPanel>
|
||
|
|
</Items>
|
||
|
|
</f:Tab>
|
||
|
|
</Tabs>
|
||
|
|
</f:TabStrip>
|
||
|
|
</Items>
|
||
|
|
</f:Panel>
|
||
|
|
</form>
|
||
|
|
</body>
|
||
|
|
<script language="javascript">
|
||
|
|
|
||
|
|
function rendChart(legend, xAxis, series) {
|
||
|
|
option = {
|
||
|
|
tooltip: {
|
||
|
|
trigger: 'axis',
|
||
|
|
axisPointer: {
|
||
|
|
axisLabel: { show: false },// 坐标轴指示器，坐标轴触发有效
|
||
|
|
type: 'shadow', // 默认为直线，可选为：'line' | 'shadow'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
show: false,
|
||
|
|
data: legend
|
||
|
|
},
|
||
|
|
grid: {
|
||
|
|
left: '3%',
|
||
|
|
right: '4%',
|
||
|
|
bottom: '10%',
|
||
|
|
containLabel: true
|
||
|
|
},
|
||
|
|
dataZoom: [
|
||
|
|
// {
|
||
|
|
// id: 'dataZoomX',
|
||
|
|
// type: 'inside',
|
||
|
|
// xAxisIndex: [0],
|
||
|
|
// filterMode: 'filter'
|
||
|
|
// },
|
||
|
|
{
|
||
|
|
id: 'dataZoomY',
|
||
|
|
type: 'inside',
|
||
|
|
yAxisIndex: [0],
|
||
|
|
// filterMode: 'empty',
|
||
|
|
// height: 120,
|
||
|
|
width:4,
|
||
|
|
start: 1, end: 50
|
||
|
|
}
|
||
|
|
],
|
||
|
|
xAxis: [
|
||
|
|
{
|
||
|
|
axisLabel: { interval: 0, show: true },
|
||
|
|
type: 'category',
|
||
|
|
data: xAxis
|
||
|
|
}
|
||
|
|
],
|
||
|
|
yAxis: [
|
||
|
|
{
|
||
|
|
type: 'value'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
series: series
|
||
|
|
};
|
||
|
|
if (xAxis.length >5) {
|
||
|
|
option.dataZoom = [{
|
||
|
|
type: 'slider',
|
||
|
|
show: true,
|
||
|
|
startValue: 0,
|
||
|
|
endValue: 4,
|
||
|
|
height: '10',
|
||
|
|
backgroundColor: '#aed0ea',
|
||
|
|
fillerColor: '#107f8b',
|
||
|
|
bottom: '4%',
|
||
|
|
zoomLock: true,
|
||
|
|
moveOnMouseWheel: true,
|
||
|
|
brushSelect: true,
|
||
|
|
showDetail: false,
|
||
|
|
}]
|
||
|
|
}
|
||
|
|
|
||
|
|
var myChart = echarts.init(document.getElementById("divAccidentTime"));
|
||
|
|
myChart.setOption(option);
|
||
|
|
}
|
||
|
|
|
||
|
|
rendChart(<%=legend%>,<%=xAxis%>,<%=series%>)
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</html>
|