修改移交
This commit is contained in:
@@ -0,0 +1,246 @@
|
||||
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SystemstatusChart.aspx.cs" Inherits="FineUIPro.Web.Transfer.Chart.SystemstatusChart" %>
|
||||
|
||||
<%@ Register Src="~/Controls/ChartControl.ascx" TagName="ChartControl" TagPrefix="uc1" %>
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head runat="server">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<title>移交统计图表</title>
|
||||
</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" Hidden="true">
|
||||
<Items>
|
||||
<f:Form ID="Form2" ShowHeader="false" ShowBorder="false" runat="server" >
|
||||
<Rows>
|
||||
<f:FormRow ColumnWidths="25% 30% 35% 10%">
|
||||
<Items>
|
||||
<f:DropDownList ID="ddlSystemNo" runat="server" Label="System No" AutoPostBack="true" EnableEdit="true"
|
||||
OnSelectedIndexChanged="ddlSystemNo_SelectedIndexChanged" Width="300px" LabelWidth="100px">
|
||||
</f:DropDownList>
|
||||
|
||||
<%-- <f:Button ID="BtnAnalyse" Text="统计" Icon="ChartPie" runat="server" OnClick="BtnAnalyse_Click">
|
||||
</f:Button>--%>
|
||||
</Items>
|
||||
</f:FormRow>
|
||||
</Rows>
|
||||
</f:Form>
|
||||
</Items>
|
||||
</f:Panel>
|
||||
<div id='two' style="width: 100%; height: 500px;"></div>
|
||||
<%-- <f:Panel ID="Panel4" CssClass="blockpanel" runat="server" EnableCollapse="false"
|
||||
BodyPadding="10px" ShowBorder="true" ShowHeader="false" Hidden="true">
|
||||
|
||||
<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" Hidden="true">
|
||||
<div id="divAccidentTime">
|
||||
<uc1:ChartControl ID="ChartAccidentTime" runat="server" />
|
||||
</div>
|
||||
</f:ContentPanel>
|
||||
|
||||
</Items>
|
||||
</f:Tab>
|
||||
</Tabs>
|
||||
</f:TabStrip>
|
||||
</Items>
|
||||
</f:Panel>--%>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<script type="text/javascript" src="../../res/index/js/swiper-3.4.2.jquery.min.js"></script>
|
||||
<script type="text/javascript" src="../../res/index/js/echarts.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
function category_Two(id, xArr, data, num) {
|
||||
// 基于准备好的dom，初始化echarts实例
|
||||
var myChart = echarts.init(document.getElementById(id))
|
||||
// 指定图表的配置项和数据
|
||||
var option = {
|
||||
title: {
|
||||
// left:'center',
|
||||
text: '移交统计图表',
|
||||
textStyle: {
|
||||
color: '#000',
|
||||
fontWeight: 'normal',
|
||||
fontSize: 12
|
||||
},
|
||||
show: true
|
||||
},
|
||||
tooltip: {},
|
||||
legend: {
|
||||
left: '15%',
|
||||
show: true,
|
||||
textStyle: {//图例文字的样式
|
||||
color: '#000',
|
||||
fontSize: 10,
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#000',
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
margin: 20,
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: '#000'
|
||||
},
|
||||
interval: 0,
|
||||
formatter: function (value) {
|
||||
var ret = "";//拼接加\n返回的类目项
|
||||
var maxLength = num;//每项显示文字个数
|
||||
var valLength = value.length;//X轴类目项的文字个数
|
||||
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
|
||||
if (rowN > 1)//如果类目项的文字大于maxLength,
|
||||
{
|
||||
for (var i = 0; i < rowN; i++) {
|
||||
var temp = "";//每次截取的字符串
|
||||
var start = i * maxLength;//开始截取的位置
|
||||
var end = start + maxLength;//结束截取的位置
|
||||
//这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
|
||||
//temp = value.substring(start, end) + "\n";
|
||||
temp = value.substring(start, end) + (i == rowN - 1 ? "" : "\n");
|
||||
ret += temp; //凭借最终的字符串
|
||||
}
|
||||
return ret;
|
||||
}
|
||||
else {
|
||||
return value;
|
||||
}
|
||||
}
|
||||
},
|
||||
type: 'category',
|
||||
data: xArr,
|
||||
boundaryGap: [0, 0.01],
|
||||
|
||||
},
|
||||
yAxis: {
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLine: {
|
||||
show: false,
|
||||
lineStyle: {
|
||||
color: '#000'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: '#000'
|
||||
}
|
||||
},
|
||||
},
|
||||
series: data,
|
||||
grid: {
|
||||
top: '20%',
|
||||
left: '0%',
|
||||
right: '0%',
|
||||
bottom: '0%',
|
||||
containLabel: true,
|
||||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||||
// borderColor: 'rgba(0,162,233, 1)'
|
||||
},
|
||||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||||
textStyle: {
|
||||
color: 'rgba(255, 255, 255, 0.3)'
|
||||
}
|
||||
}
|
||||
option.dataZoom = [//给x轴设置滚动条
|
||||
{
|
||||
|
||||
start: 0,//默认为0
|
||||
type: 'slider',
|
||||
show: true,
|
||||
startValue: 0,
|
||||
endValue: 9,
|
||||
height: 6,
|
||||
bottom: '6%',
|
||||
zoomLock: true,
|
||||
moveOnMouseWheel: true,
|
||||
brushSelect: true,
|
||||
showDetail: false,
|
||||
borderColor: "rgba(43,48,67,0.8)",
|
||||
fillerColor: '#269cdb',//滑动块的颜色
|
||||
backgroundColor: '#33384b',//两边未选中的滑动条区域的颜色
|
||||
|
||||
}]
|
||||
// 使用刚指定的配置项和数据显示图表。
|
||||
myChart.setOption(option)
|
||||
}
|
||||
|
||||
|
||||
var xArr = [<%=AllSystemNo%>]
|
||||
//var xArr = two2.categories
|
||||
var data = [
|
||||
{
|
||||
name: '完成数量',
|
||||
type: 'bar',
|
||||
stack: '总量',
|
||||
barWidth: 40,
|
||||
data: [<%=completed%>],
|
||||
//data: two2.series[0].data,
|
||||
label: { //柱体上显示数值
|
||||
show: true,//开启显示
|
||||
position: ['40%', '50%'],//在上方显示
|
||||
textStyle: {//数值样式
|
||||
fontSize: '20px',
|
||||
color: '#000'
|
||||
},
|
||||
formatter: '{c}',
|
||||
},
|
||||
itemStyle: { normal: { color: '#84CF75' } }
|
||||
},
|
||||
{
|
||||
name: '进行中数量',
|
||||
type: 'bar',
|
||||
stack: '总量',
|
||||
barWidth: 40,
|
||||
data: [<%=Inprogress%>],
|
||||
//data: two2.series[1].data,
|
||||
label: { //柱体上显示数值
|
||||
show: true,//开启显示
|
||||
position: ['40%', '50%'],//在上方显示
|
||||
textStyle: {//数值样式
|
||||
fontSize: '20px',
|
||||
color: '#000'
|
||||
},
|
||||
formatter: '{c}',
|
||||
},
|
||||
itemStyle: { normal: { color: '#3282F6' } }
|
||||
},
|
||||
{
|
||||
name: '未完成数量',
|
||||
type: 'bar',
|
||||
stack: '总量',
|
||||
barWidth: 40,
|
||||
data: [<%=NotStart%>],
|
||||
//data: two2.series[1].data,
|
||||
label: { //柱体上显示数值
|
||||
show: true,//开启显示
|
||||
position: ['40%', '50%'],//在上方显示
|
||||
textStyle: {//数值样式
|
||||
fontSize: '20px',
|
||||
color: '#000'
|
||||
},
|
||||
formatter: '{c}',
|
||||
},
|
||||
itemStyle: { normal: { color: '#EB3324' } }
|
||||
}
|
||||
]
|
||||
category_Two('two', xArr, data, 20)
|
||||
</script>
|
||||
Reference in New Issue
Block a user