文章 "HTML 中的图表" - 页 2

新评论
 

以下是 data-from-csv.htm 的代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>
        
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 <title>Highcharts Example</title>


<!-- 1. Add these JavaScript inclusions in the head of your page -->

 
 <script src="jquery.min.js" type="text/javascript"></script>
 <script src="highcharts.js" type="text/javascript"></script>
<!-- - -->              



<!-- 2. Add the JavaScript to initialize the chart on document ready -->
                
 
 <script type="text/javascript">
                

$(document).ready(function() {
        
  var options = {

        chart: {
          renderTo: 'container',
          defaultSeriesType: 'column'
        },
        title: {
          text: 'Autocorrelation'
        },
        xAxis: {

          categories: []
                                
        },
        yAxis: {
          title: {
            text: 'Units'
          }
        },
        series: []
        };
                        
                        
/*
 从 CSV 文件加载数据。*/            

                        
$.get('data.csv', function(data) {
                                
 // 分割行
                                
 var lines = data.split('\n');
                                
 $.each(lines, function(lineNo, line) {
                                        
   var items = line.split(',');
                                        
                                        
   // 标题行包含类别
                                        
   if (lineNo == 0) {
                                                
     $.each(items, function(itemNo, item) {
                                                        
       if (itemNo > 0) options.xAxis.categories.push(item);
                                                
    });
                                        }
                                        
                                        
// 其余各行包含的数据，其名称位于第一个位置
                
else {
                                                
var series = { 
                                                        
data: []
                                                
};
                                                
$.each(items, function(itemNo, item) {
                
if (itemNo == 0) {
                
series.name = item;
                                                        
} else {

series.data.push(parseFloat(item));
        
}
                                                
});
                                        
options.series.push(series);

                                        
}
                                        
                                
});
                                
                                
var chart = new Highcharts.Chart(options);
                        
});
});
                
</script>
                
        
</head>
        <body>
                
                
<!-- 3. Add the container -->
                
<div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
        
</body>
</html>

下面是数据文件 data.csv：

Categories,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21
ACF,0.0048,-0.0084,-0.0094,-0.0080,-0.0037,-0.0067,0.0052,-0.0018,0.0066,0.0267,-0.0210,0.0013,0.0032,-0.0027,0.0207,-0.0059,-0.0131,0.0160,0.0250,-0.0077
Bounds,0.0073,-0.0073,-0.0073,-0.0073,-0.0073,-0.0073,0.0073,-0.0073,0.0073,0.0073,-0.0073,0.0073,0.0073,-0.0073,0.0073,-0.0073,-0.0073,0.0073,0.0073,-0.0073

我没有附上库文件。

 

感谢您的 "帮助"：和往常一样，没有人帮忙，我自己想出来的 :-)

请问作者，有没有类似的 3D 图表？

 

是的。MT5 的信息图形显示有点弱。可以画出多少有趣的东西啊！：一切事物的相关性图表、通过不同小波变换动态显示当前汇率、3D 以及天知道还有什么。我想在不同速率序列残差的半混沌相关性上做一些明亮的屏幕显示！

策略测试仪 的图形效果尤其糟糕。甚至连将测试结果导出为文本文件都做不到。

顺便说一句，如果你想将数据导出到文件，最好不要自己制作图形，而是使用现成的软件包，如 vinnigraphics、sigmaplot、origine 或 excel。

我对文章的标题--概率分布函数--尤为满意。人们正在努力对这门课程进行合理的研究。很高兴看到这一点。

 

感谢您提供这个优秀的脚本！

能否让这个脚本在策略测试器 的测试结果（而不是交易服务器上的交易历史）上运行？

这将大大有助于解释测试结果。

谢谢

吉诺

 

我不知道在哪里可以下载据说附在文章后面的文件？文件名是有，但里面没有链接：

文件

JS_Lib.zip - 文件 highcharts.js 和 jquery.min.js 库
Test.zip - 文件 highcharts.js、jquery.min.js 和 Test_01.htm
Example1.zip - 文件 highcharts.js、jquery.min.js、Example1.htm, Example1.mq5 和 exdat.txt
Example2.zip - 文件 Example2.htm 和 exdat.txt
Report.zip - 文件 ProfitReport.htm 和 data.txt
ProfitReport.mq5 - 用于收集统计数据和创建 data.txt 文件的脚本。

 
作为一名网络程序员，我在工作中使用了 FusionCharts 库。
我喜欢在模板上简单地安装图表和图形。
1.我连接 Java Script 库 FusionCharts。
2.创建一个 DIV 来显示图表（id="chart_container"）。
3.将图表数据插入 chartData 数组。
4.编辑 chartConfig 数组。这是图表的设计和参数。
5.我调用 FusionCharts.ready(function(){ var fusioncharts = new FusionCharts(chartConfig);fusioncharts.render(); })；
示例的详细代码和演示： http://profi.spage.me/jquery/creation-of-graphs-chart-and-diagrams-on-java-script
Creation of graphs, chart and diagrams on Java Script – profi.spage.me
  • profi.spage.me
Use Java Script Library FusionCharts to Create Graphs. Connect library FusionCharts to page. The documentation for this library can be found here. Create tag DIV id=”chart_container” for reload the chart. Create an array of data for the chart board. Create an array parameters for the chart design...
12
新评论