越秀公司网站建设,wordpress 联系,做网站需要那些东西,wordpress美文主题我们使用highcharts设置实况图#xff0c;在图表被配置对象定义后#xff0c;可选预处理和最终启用#xff0c;以及渲染会使用新的Highcharts.Chart()。我们可以使用 API修改图表。图表、轴、系列以及点对象会有一系列方式#xff0c;比如#xff1a;更新、删除、 addSeri…我们使用highcharts设置实况图在图表被配置对象定义后可选预处理和最终启用以及渲染会使用新的Highcharts.Chart()。我们可以使用 API修改图表。图表、轴、系列以及点对象会有一系列方式比如更新、删除、 addSeries、 addPoints等。设置实况图接下来我们将进入主题谈一谈如何使用Highcharts让他以每秒甚至更精确的时间从服务器索检数据运行实况图。这个工作是通过建立一个自定义函数、requestData这些最初被称为图表负载事件和Ajax成功回调函数来实现的。体验一下设置服务器在这个例子中我们有一个返回JavaScript时间的JavaScript数组和一个随机的y值。下载文件live-server-data.php// Set the JSON headerheader(Content-type: text/json);// The x value is the current JavaScript time, which is the Unix time multiplied// by 1000.$x time() * 1000;// The y value is a random number$y rand(0, 100);// Create a PHP array and echo it as JSON$ret array($x, $y);echo json_encode($ret);?全范围内定义变量图表我们想从已设置好的文档功能和requestData功能访问图表我们可以全范围内定义变量图表。如果图表变量在文件内部反馈功能中被定义无法在全局范围使用。var chart; // global设置requestData功能这个例子我们使用 jQuerys $.ajax 方法完成Ajax工作但也可以使用任何其他Ajax框架。当服务器成功接收到数据字符串重新运算求出参数的内容使用Highcharts addPoint并添加进图表数据系列。如果数据系列长度比20大我们改变第一个点然后系列会移动到左边而不是和点靠得更紧。/*** Request data from the server, add it to the graph and set a timeout* to request again*/function requestData() {$.ajax({url: live-server-data.php,success: function(point) {var series chart.series[0],shift series.data.length 20; // shift if the series is// longer than 20// add the pointchart.series[0].addPoint(point, true, shift);// call it again after one secondsetTimeout(requestData, 1000);},cache: false});}创建图表注意equestData功能是如何开始从图表负载事件中呼出的初始数据是空数组。$(document).ready(function() {chart new Highcharts.Chart({chart: {renderTo: container,defaultSeriesType: spline,events: {load: requestData}},title: {text: Live random data},xAxis: {type: datetime,tickPixelInterval: 150,maxZoom: 20 * 1000},yAxis: {minPadding: 0.2,maxPadding: 0.2,title: {text: Value,margin: 80}},series: [{name: Random data,data: []}]});});相关资源图表highcharts本站文章除注明转载外均为本站原创或翻译。欢迎任何形式的转载但请务必注明出处、不得修改原文相关链接如果存在内容上的异议请邮件反馈至heyevget.com文章转载自慧都控件网
