标签:
//页面端
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>
<script type="text/javascript" src="{$tplurl}/js/highchart/jquery-1.9.1.min.js"></script>
</head>
<body>
<script src="{$tplurl}/js/highchart/highcharts.js"></script>
<script src="{$tplurl}/js/highchart/exporting.js"></script>
{literal}
<script type="text/javascript">
var options = {
chart: {
renderTo:‘container1‘,
type: ‘spline‘,
style: {
color: "#fc0",
borderColor: ‘#dddddd‘,
plotShadow: {
width: 3,
color: ‘#000000‘,
offsetX: 1,
offsetY: 1
}
}
},
legend: {
enabled: false //下面注释2013-2014
},
title: {
text: ‘‘
},
credits: {enabled: false }, //去掉下角标示
exporting: { enabled: false }, //去掉打印及其导出按钮
subtitle: {
text: ‘元优资产‘
},
xAxis: {
tickPixelInterval: 5,//设置横坐标密度
gridLineWidth: 1,
startOnTick: true,
endOnTick: false,
tickmarkPlacement: ‘on‘,
tickLength: 6,
gridLineDashStyle: "dash",
labels: {
format: ‘{value:%Y-%m-%d}‘,
rotation: 10,
align: ‘left‘,
step: 0,
staggerLines: 1,
y: 22,
overflow: ‘justify‘
}
},
yAxis: {
tickPixelInterval: 2,
categories: [ ‘0‘, ‘1‘, ‘2‘, ‘3‘],
title: {
enabled: false
}
},
tooltip: {
headerFormat: ‘<b>{series.name}</b><br>‘,
pointFormat: ‘{point.x:%Y/%m/%d} {point.y}净值‘
},
plotOptions: {
spline: {
marker: {
enabled: false
}
}
},
series: [
{
color: ‘#aa4643‘,
marker: {
symbol: ‘square‘
},
name: ‘2013-2014‘,
data:[]
}
]
};
function stw1(){
$(".container1").show();
var series = {
color: ‘#aa4643‘,
marker: {
symbol: ‘square‘
},
name: ‘2013-2014‘,
data: []
};
var form={}; //ajax参数传递
$.post(‘/index.php?user&q=action/login‘,form,function(data){
$.each(data,function(i){
var nian = parseInt(data[i][0][0]); //转换整数
var yue = parseInt(data[i][0][1]); //转换整数
var ri = parseInt(data[i][0][2]); //转换整数
var jz = parseFloat(data[i][1]); //转换浮点数
series.data.push([Date.UTC(nian,yue, ri),jz]); //往data数组下push数据
})
options.series.push(series); //把组合好的series 赋值到 highchart series 中
var chart = new Highcharts.Chart(options); //重新加载 ok
},‘json‘);
}
</script>
{/literal}
<div onclick="stw1()">加载</div>
<div class="ssss" style="width:50px; height:30px; background: #666; margin: 0 auto; position: relative; overflow: inherit;">
<div class="container1" style="width: 330px; height:235px; position: absolute;left: -310px; top:0px; display: none; float: left;">
<div style="float: left; margin-top: 25px;">
<div style="width:16px; height:12px; float: right; margin-right: -1px;"><img src="{$tplurl}/images/tou.png"></div>
<div style="clear: both;"></div>
<div id="container1" style="width: 300px; height: 180px; margin: 0 auto; border: 3px #000 solid;"></div>
</div>
</div>
</div>
</body>
</html>
//php程序段
$str[0][0] = array(2013,2,27);
$str[0][1] = -1;
$str[1][0] = array(2013,3,1);
$str[1][1] = 0.5;
$str[2][0] = array(2013,3,5);
$str[2][1] = 0.8;
$str[3][0] = array(2013,3,10);
$str[3][1] = 1;
$str[4][0] = array(2013,3,12);
$str[4][1] = 1.3;
$str[5][0] = array(2013,3,15);
$str[5][1] = 1.8;
$str[6][0] = array(2013,3,27);
$str[6][1] = 2;
//测试highchart
echo json_encode($str); exit;
标签:
原文地址:http://www.cnblogs.com/zhizhong/p/4391696.html