<script type="text/javascript">
var chart,dmdateZZ,jjsw,zgsw,dmLineName,jjMax,zgMax,stnm;
dmLineName = '#{heDaoBean.lineDmZZ}';//时间
dmdateZZ = #{heDaoBean.dmZZ};//断面图数据
jjsw = #{heDaoBean.wrz};//警戒水位线Y值
jjMax= #{heDaoBean.lenghtXZZ};//警戒水位线x值
zgsw = #{heDaoBean.obhtzMax};//最高水位线y值
zgMax= #{heDaoBean.lenghtXZZ};//最高水位线x值
stnm = '#{heDaoBean.stnm}';//河道水位站站名
$j(function($) {
chart = new Highcharts.Chart({
chart: {
renderTo: 'duanmian'//此处与下面的div的id值对应
},
colors: [
'#333333',
'#FF6633',
'#FF0000'
],
title: {
text: '河流横断面验测成果'
},
xAxis: {
reversed : false,
labels: {
formatter: function() {
return this.value +'m';
},
style: {
color: '#89A54E'
}
},
title: {
text: '起点距'
}
},
yAxis: {
labels: {
formatter: function() {
return this.value +'m';
},
style: {
color: '#89A54E'
}
},
title: {
text: '河底高程'
}
},
plotOptions: {
line: {
lineWidth: 6,
states: {
hover: {
lineWidth: 5
}
},
marker: {
enabled: true,
states: {
hover: {
enabled: false,
radius: 5,
lineWidth: 1
}
}
}
},
areaspline: {
lineWidth: 4,
states: {
hover: {
lineWidth: 5
}
},
marker: {
enabled: false,
states: {
hover: {
enabled: false,
radius: 5,
lineWidth: 1
}
}
}
}
},
series: [{
type: 'areaspline',//断面图 标识
name: '断面图',
data: dmdateZZ //dmdateZZ的数据格式:[[0.0,500.0],[1.0,490.0],[4.0,400.0]]
}, {
type: 'line',//直线标识
name: '警戒水位',
data: [[0,jjsw],{
x:jjMax,
y: jjsw,
marker: {
enabled: true,
symbol: 'url(/static/common/images/icons/sum.gif)'
}
} ]
}, {
type: 'line',
name: '实测最高水位',
data: [[0,zgsw],{
x:zgMax,
y:zgsw,
marker: {
enabled: true,
symbol: 'url(/static/common/images/icons/sum.gif)'
}
} ]
},
{
name: dmLineName
},{
name: stnm
}]
});
});
</script>
<div align="center" id="duanmian" style="width: 100%; height: 320px; margin: 0 auto"></div>
界面显示效果图:
分享到:
相关推荐
这是JSF标准的实现框架,一个是JSF2.0的官方实现,一个是JSF2.2的Apache MyFaces实现。
JSF工程实例源代码,包含实现文件上传与下载的全部源代码和文档,数据库使用oracle10g
自己写的JSF文件上传项目,可以最大支持最大1.99G文件 需要的jar包需奥自己加 附:jar目录截图
JavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源代码 jsf-implJavaEE源...
JavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-apiJavaEE源代码 jsf-...
jsf1.2+ejb3.0实现的员工管理系统 <br>1.项目说明: 本实例是一个用JSF1.2+EJB3.0实现的员工CRUD的一个实例,业务非常简单,主要是为了演示这两种技术的使用。若与商业应用类同,纯属巧合。 <br>2.源码...
jsf1.2+ejb3.0实现的员工管理系统,做成了部分:一部分是ejb端,实现业务逻辑;另一部分是web端,实现web浏览。通过这个实例,你可以学会用jsf1.2和ejb3去做企业项目。内附源代码、分析和部署文档。
第1部分-增强JSF页面的外观(CSS、JavaScript和JSF联合打造 Ajax应用程序).zip
JSF2.0源代码,具体版本是2.03。但与其它版本差别不太,适用下不了源码的GGMM。
JSF+hibernate实现批量删除,CRUD
JSF JSF2.0 Ajax javaweb JSF与Ajax交互实现
jsf2.1.0 jar包和原代码jsf2.1.0 jar包和原代码jsf2.1.0 jar包和原代码jsf2.1.0 jar包和原代码jsf2.1.0 jar包和原代码jsf2.1.0 jar包和原代码
jsf后台 + primefaces (html,css,javascript)前端实现网盘技术网页源代码。
jsf结合ajax实现文件上传,值得阅读
JSF分页有不少的组件可以使用,但用起来都不是想象的那么简单,这里自己实现了一个简单的分页实现,以提供大家分享。 有更好的意见请留言。或者去...
sun 最新框架,jsf写的j2ee项目代码
在java中的jsf页面上,动态生成表格
这是一个使用jsf框架实现简易登录功能的小例子,对于初学者可以参考一下。
jsf页面上的客服浮动窗口