中指定的元素 "container1" 的尺寸确定。
考虑到所做的更改之后，我们的示例代码如下所示：
Example
var dat1 = [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4];
var chart1;
$(document).ready(function(){
chart1 = new Highcharts.Chart({
chart: {renderTo: 'container1'},
series: [{data: dat1}]
});
});
可以从文末的附件复制此测试案例和所有库。Test_01.htm 示例文件以及库文件位于相同的 \Test 文件夹中，因此，我们只需要双击 HTML 文件 Test_01.htm 即可查看赫兹的工作成果。
必须记住，要正常显示此测试页面，应在 WEB 浏览器中允许 JavaScript 的执行。因为出于安全目的，浏览器允许您禁用此选项，它有可能被关闭。如此一来，赫兹应能看到下图：
编辑
添加图片注释，不超过 140 字（可选）
图 1. Test_01.htm
这是赫兹的第一个测试图表，尽管此技术表面上很复杂，但是其创建并不需要太长的时间。
赫兹应指出以此方式创建的显示图表的某些特点。在复制的目录中，打开文件 Test_01.htm，如果 WEB 浏览器允许您放大查看的页面，您将发现，即使放大很多倍，图表的质量也不会变差。
这是因为此图表不是诸如 PNG 或 JPEG 文件等静态图像，在放大或缩小为其绘图分配的区域后会重绘图像。因此，此类图像不能用我们通常喜欢的图片保存方式保存到磁盘。因为图表是采用 JavaScript 创建的，我们必须指出，不同的浏览器具有它们自己的对该语言的内置解释程序，可能并不始终都是按相同的方式执行程序。
使用 JavaScript 创建的图表在使用不同的浏览器查看时可能会有所不同。大多数情况下，与其他浏览器相比，这些差异最常出现在 Internet Explorer 中。
但是我们希望 JavaScript 库的创建者能够考虑让他们的代码与最流行的 WEB 浏览器具有可能的最大兼容性。
MetaTrader 5 和 MQL5
在以上例子中，要在图表中显示的数据是在创建 HTML 页面期间手动设定的。为了安排将数据从 MetaTrader 5 传输到创建的图表，我们使用最简单的方法。让 MetaTrader 5 将数据记录到一个单独的文件，然后在显示图表时从该文件将数据载入浏览器。让我们编写一个包含 HTML 页面的例子，该例子通过从一个文件和 MQL5 中创建此文件的脚本下载数据，从而显示图表。
对于 HTML 文件，我们将使用以前创建的文件 Test_01.htm（先对其进行一些小的更改）。我们将修改后的文件称为 example1.htm。做出的更改将会减少，因为以下代码行：
var dat1 = [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4];
将被替换为
var dat1=[0];
现在，浏览器在下载 HTML 页面时也需要下载 exdat.txt 文本文件，在该文件中，要显示在图表中的值将被赋予 dat1 数组。此文件应包含一段 JavaScript 代码。可以使用对应的脚本在 MetaTrader 5 中轻松创建此文件。
以下提供了此类脚本的一个例子。
//+------------------------------------------------------------------+
//| Example1.mq5 |
//| Copyright 2010, MetaQuotes Software Corp. |
//| |
//+------------------------------------------------------------------+
#property copyright "Copyright 2010, MetaQuotes Software Corp."
#property link "
#property version "1.00"
//+------------------------------------------------------------------+
//| Script program start function |
//+------------------------------------------------------------------+
void OnStart()
{
int i,n,fhandle;
double gr[25];
string str;
n=ArraySize(gr);
for(i=0;i
替换为
接着，使用 Notepad 等文本编辑器，打开库 jquery.min.js 的文件，然后通过选择命令 "Select all"（全选）来复制文件的内容。再接着，打开文件 Example1.htm，在标记 和 之间粘贴复制的库文本。将获得的文件保存为 Example2.htm。以同样的方式，将库 highcharts.js 的内容复制到此文件，将其放在以前复制的库文本和标记 之间。
作为复制的结果，HTML 文件的大小增加，然而，现在我们不需要为了其正确显示而分开库文件了。在 Folder\Example2 中包含 exdat.txt 数据文件就已经足够，该文件夹包含文件 Example2.htm，并且在本文末尾的附件部分提供了 exdat.txt。
以图形格式表示的交易历史报告
为了更加完整的说明所提议的显示图形信息的方法，我们将创建一个报告，该报告以指定时间间隔显示交易帐户的历史记录。在您于 MetaTrader 5 中选择 "History"（历史记录）选项卡的上下文菜单中的 "Report"（报告）命令时创建的基于 HTML 的报告将用作原型。此报告包含大量不同的特征，以一张表格汇总。假定这些特征以图表格式表示会更加直观，让我们使用 highcharts.js 图形库来显示它们。
在上面的例子中，为了构建图表，我们使用了在此版本的 highcharts.js 库中设置的默认显示参数。
出于实践目的，此选项不会成功，因为在每种情况下我们都必须调整图表的显示以满足个人的具体要求。出于此目的，highcharts.js 库提供各种各样的机会，具有大量可应用于图表的选项。如前文所述，可以 中找到选项列表以及它们的详细描述和示例。
我们不会在图形库选项的描述和其运用细节上踌躇不前，因为本文的主旨仅是建议和演示使用 WEB 浏览器显示从 MetaTrader 5 收到的信息的能力。特别是因为取决于对 WEB 页面的创建的具体要求，也可以使用其他的 JavaScript 库。读者可以独立地选择最适合的库，并且依据实际运用的需要尽可能深入地研究它。
为了显示交易帐户的历史记录，我们创建了 ProfitReport.htm 文件。可以在附件中找到该文件。\Report 文件夹包含 data.txt 文件，该文件含有要显示的数据。文件 data.txt 作为一个例子放置在该文件夹中。
当我们复制 \Report 文件夹并打开 ProfitReport.htm 时，赫兹将看到以图形格式出现、为本例创建的测试帐户的交易特征。
编辑
添加图片注释，不超过 140 字（可选）
图 3. ProfitReport.htm
在创建 ProfitReport.htm 时，我们首先进行了大概的页面布局，并且确定了哪些类型的信息大概在什么位置。
然后我们将使用默认选项的图表放在页面中。
创建此模板后，我们为每个图表单独选择最适合的选项。在完成编辑之后，我们简单地将库的文本复制到页面中。如前文所述，为了正确显示页面，它应位于包含要显示的数据的文件 data.txt 所在的同一目录中。
文件 data.txt 是在 MetaTrader 5 中用 ProfitReport.mq5 脚本创建的。如果成功执行此脚本，则将在 \MQL5\Files 文件夹中创建包含当前活动帐户的交易特征的文件 data.txt。
必须记住，脚本应放在 \MQL5\Scripts 文件夹中并且经过编译。
//-----------------------------------------------------------------------------------
// ProfitReport.mq5
// Copyright 2011, MetaQuotes Software Corp.
//
//-----------------------------------------------------------------------------------
#property copyright "Copyright 2011, MetaQuotes Software Corp."
#property link "
#property version "1.00"
#property script_show_inputs
#include
#include
#include
#include
//--- input parameters
input int nD=30; // Number of days
//--- global
double balabce_cur=0; // balance
double initbalance_cur=0; // Initial balance (not including deposits to the account)
int days_num; // number of days in the report (including the current day)
datetime tfrom_tim; // Date from
datetime tend_tim; // Date to
double netprofit_cur=0; // Total Net Profit
double grossprofit_cur=0; // Gross Profit
double grossloss_cur=0; // Gross Loss
int totaltrades_num=0; // Total Trades
int longtrades_num=0; // Number of Long Trades
double longtrades_perc=0; // % of Long Trades
int shorttrades_num=0; // Number of Short Trades
double shorttrades_perc=0; // % of Short Trades
int proftrad_num=0; // Number of All Profit Trades
double proftrad_perc=0; // % of All Profit Trades
int losstrad_num=0; // Number of All Loss Trades
double losstrad_perc=0; // % of All Loss Trades
int shortprof_num=0; // Number of Short Profit Trades
double shortprof_perc=0; // % of Short Profit Trades
double shortloss_perc=0; // % of Short Loss Trades
int longprof_num=0; // Number of Long Profit Trades
double longprof_perc=0; // % of Long Profit Trades
double longloss_perc=0; // % of Long Loss Trades
int maxconswins_num=0; // Number of Maximum consecutive wins
double maxconswins_cur=0; // Maximum consecutive wins ($)
int maxconsloss_num=0; // Number of Maximum consecutive losses
double maxconsloss_cur=0; // Maximum consecutive losses ($)
int aveconswins_num=0; // Number of Average consecutive wins
double aveconswins_cur=0; // Average consecutive wins ($)
int aveconsloss_num=0; // Number of Average consecutive losses
double aveconsloss_cur=0; // Average consecutive losses ($)
double largproftrad_cur=0; // Largest profit trade
double averproftrad_cur=0; // Average profit trade
double larglosstrad_cur=0; // Largest loss trade
double averlosstrad_cur=0; // Average loss trade
double profitfactor=0; // Profit Factor
double expectpayoff=0; // Expected Payoff
double recovfactor=0; // Recovery Factor
double sharperatio=0; // Sharpe Ratio
double ddownabs_cur=0; // Balance Drawdown Absolute
double ddownmax_cur=0; // Balance Drawdown Maximal
double ddownmax_perc=0; // % of Balance Drawdown Maximal
int symbols_num=0; // Numbre of Symbols
string Band="";
double Probab[33],Normal[33];
CArrayLong TimTrad;
CArrayDouble ValTrad;
CArrayString SymNam;
CArrayInt nSymb;
//-----------------------------------------------------------------------------------
// Script program start function
//-----------------------------------------------------------------------------------
void OnStart()
{
int i,n,m,k,nwins=0,nloss=0,naverw=0,naverl=0,nw=0,nl=0;
double bal,sum,val,p,stdev,vwins=0,vloss=0,averwin=0,averlos=0,pmax=0;
MqlDateTime dt;
datetime ttmp,it;
string symb,br;
ulong ticket;
long dtype,entry;
if(!TerminalInfoInteger(TERMINAL_CONNECTED)){printf("Terminal not connected.");return;}
days_num=nD;
if(days_n
initbalance_cur=balabce_cur-netprofit_cur;
if(totaltrades_num>0)
ev+=p*p;
val=bal;
}
stdev=MathSqrt(stdev/ValTrad.Total());
if(stdev>
}
p=1.0/MathSqrt(2*M_PI)/4.0;
for(m=0;m0)
{
str+=",["+DoubleToString(((double)n-16)/4.0,2)+","+DoubleToString(Probab[n],5)+"]";
}
}
str+=",[4.25,0]";
FileWriteString(fhandle,"var Probab=["+str+"];\n");
str=""; sum=0;
if(ValTrad.Total()>0)
{
sum+=ValTrad.At(0);
str+="["+(string)(ulong)(TimTrad.At(0)*1000)+","+DoubleToString(sum,2)+"]";
for(n=1;n
