1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 |
- <!doctype html>
- <html>
- <head>
- <title>料肉比</title>
- <script type="text/javascript">
- $(function() {
- $("#container").highcharts({
- chart : {
- backgroundColor: "rgba(0,0,0,0)", // 背景透明
- margin: [30, 5, 40, 45],
- renderTo : "container"
- },
- colors : [ "#3a8ecf", "#f6bd0f", "#8bba00"],
- exporting : {
- enabled : false
- },
- title : {
- text : "料肉比",
- style : {
- fontSize : 16,
- },
- margin : 10
- },
- xAxis : {
- categories : eval($("#categories").val()),
- },
- yAxis : {
- title : {
- text : null
- },
- tickPixelInterval : 50,
- gridLineDashStyle : "longdash"
- },
- tooltip : {
- formatter : function() {
- return "<b>" + this.series.name + "</b><br/>"
- + "日期: <b>" + this.x + "</b><br/>"
- + "比例: <b>" + this.y + "</b><br/>"
- + "当前体重: <b>" + this.point.extra + "Kg</b>";
- },
- followTouchMove : true,
- shared : false,
- useHTML : true,
- crosshairs : [ {
- width : 2,
- color : "gray",
- dashStyle : "shortdot"
- }, {
- width : 2,
- color : "gray",
- dashStyle : "shortdot"
- } ]
- },
- legend : {
- layout : "vertical",
- align : "right",
- verticalAlign : "top",
- borderWidth : 0
- },
- credits : {
- enabled : false
- },
- plotOptions : {
- column : {
- pointPadding : 0.2,
- borderWidth : 0
- },
- series : {
- marker : {
- enabled : true, //数据点是否显示
- radius : 3.5, //数据点大小
- },
- }
- },
- series : [ {
- name : "总体料肉比",
- data : eval($("#qcdata").val())
- }, {
- name : "日料肉比",
- data : eval($("#rdata").val())
- } ],
- });
- });
- </script>
- </head>
- <body>
- <input type="hidden" id="categories" name="categories" value="$!categories" />
- <input type="hidden" id="qcdata" name="qcdata" value="$!qcdata" />
- <input type="hidden" id="rdata" name="rdata" value="$!rdata" />
- <input type="hidden" value="$!type" id="type">
- <div>
- <div id="container" style="height: 100%; width: 100%;"></div>
- </div>
- </body>
- </html>
|