TeeChart for PHP包含100%的PHP源代码。它支持PHP5及更高的版本。它可作为一个调色板组件整合到针对PHP的Delphi编程环境中，从而让其他人在运行时以创建组件的方式来引用。第一个版本提供17种图表类型（2D和3D的多种组合），11个数学函数和一些图表工具组件以扩展功能。
本教程是TeeChart for PHP教程中Javascript / HTML5图表这一节，将会介绍如何在客户端页面上创建静态和实时HTML5图表。内容主要分为以下几个部分：
-
介绍
-
静态导出
-
实时HTML5图表
介绍
TeeChart for PHP为您提供了将图表编写到原生HTML5中的浏览器页面的可能性，有两种模式，Static/静态和Live/实时。
静态将图表写为原始级别的画布命令系列，忠实地将图表的每一行，原始形状和文本复制为一系列原生HTML5画布指令。此导出格式可以重现TeeChart PHP库中的每个图表，就像JPEG或PNG格式图像一样。
实时将图表写为一系列可寻址的HTML5元素。这允许动画和交互性应用于原生HTML5 Javascript格式的图表。此导出模式不支持所有图表类型，有关详细信息，请参阅下面的描述部分，但允许添加交互式工具并支持mousedrag缩放和页面滚动。
静态导出
将图表导出为静态HTML5将生成文件或文本，其中包含浏览器理解和显示图表所必需的代码。 获得的外观几乎与使用GDGraphics生成的图表相同。
如何导出到静态HTML5图表
将Chart导出到HTML5所需的步骤很简单，它只包含一行代码：
include "../../../../sources/TChart.php";
$chart1 = new TChart(500,350);
$chart1->getAspect()->setView3D(false);
$chart1->getHeader()->setText("HTML5 Demo");
$chart1->getPanel()->getGradient()->setVisible(false);
$chart1->getPanel()->setColor(Color::WHITE());
// Add Series to the Chart
$line = new Line($chart1->getChart());
$line->fillSampleValues(6);
$line->setColor(Color::DARK_GRAY());
$line->getLinePen()->setWidth(3);
$line->getPointer()->setVisible(true);
$line->getPointer()->setStyle(PointerStyle::$CIRCLE);
$chart1->getChart()->getExport()->getImage()->getHTML5()->save($path."\\TChart.html");
此代码将创建一个html文件，其中包含执行或html 5 Chart所必需的行。
您可以在导出 - > HTML5 - > HTML5导出文件夹中找到的功能演示中找到如何使用它的示例。
实时HTML5图表
正如我们在教程11-插件和附加功能中看到的，最新版本的TeeChart PHP在其源代码中包含了一个版本的TeeChart JavaScript，它允许我们使用javascript版本独立的使用javascript代码在我们的浏览器中生成图表，我们也可以继续使用我们的PHP代码创建图表，然后将其导出到javascript图表，从而在我们的实时页面上获取javascript图表，而无需使用单行的javascript代码。
并非所有系列类型都可用于此类导出。
可以在Features - > JScript - > TeeChartJavaScript中的功能演示中找到示例。
其他使用不同类型os系列的工作示例可以在Features - > JScript - > Series - >中的Features演示中找到。
如何导出到实时HTML5图表
当我们将图表输入到javascript（实时）时，我们有两个选项可供选择。
我们可以将Chart导出到一个文件中，在该文件中我们生成一个HTML文件，其中包含浏览器的必要代码，以便在javascript中显示代码：
$chart1->getChart()->getExport()->getImage()->getJavaScript()->SaveToFile('jschartToolTip.html', $chartName);
或者我们可以直接导出到流，这将允许我们直接在浏览器中绘制图表，而无需事先将代码保存在文件中。
echo $chart1->getChart()->getExport()->getImage()->getJavaScript()->Render($chartName)->toString();
$ chartName参数是可选的，当我们需要在使用的javascript代码中使用Chart的名称时，它将用作id。如果未包含此参数，则默认使用chart1。
您可以在JScript文件夹的Features演示中找到工作示例。
以下是完整代码的示例：
getChart());
$line->fillSampleValues(6);
$line->getPointer()->setVisible(true);
$tipTool = new ToolTip($chart1->getChart());
$tipTool->setSeries($line);
$tipTool->getFont()->setName('Tahoma');
$tipTool->getFont()->setSize(20);
$tipTool->getFont()->setColor(Color::RED());
$tipTool->setOnShow("
function(tool,series,index) { scaling=2; poindex=index; }
");
$tipTool->setOnHide("
function() { scaling=0; poindex=-1; }
");
$tipTool->setOnGetText('
function(tool,text) { return "Text:\n"+text; }
');
// In case you want to save to a file
$chart1->getChart()->getExport()->getImage()->getJavaScript()->SaveToFile('jschartToolTip.html');
?>
getChart()->getExport()->getImage()->getJavaScript()->Render()->toString();
?>
Javascript / HTML5图表工具
PHP版本中包含的JavaScript功能允许我们轻松地向Chart添加各种工具。这些只能在导出实时图表时使用。可用的工具是：
注解
此工具允许我们在图表中添加一个或多个注释。您可以选择帮助库中提供的属性。
此外，您可以在Features - > JScript - > Annotation中的Features演示中找到示例。
$chart1->getChart()->getTools()->add(new Annotation());
$chart1->getChart()->getTools()->getTool(0)->setText("Annotation");
$chart1->getChart()->getTools()->getTool(0)->setLeft(100);
$chart1->getChart()->getTools()->getTool(0)->setTop(100);
光标
如果我们使用光标工具，我们可以在Chart中显示不同的游标。这些可以根据您的喜好进行定制，方法是更改颜色，宽度和长度等属性，并使其跟随鼠标的移动。
它包含一个事件（指定为属性）OnChange，它允许我们在页面中添加javascript。更改它将被指定为文本，并将在Cursor的事件OnChange中执行。
可以在Features - > JScript - > Cursor中的Features演示中找到示例.
滚轮
滚轮工具允许我们在包含大量数据时选择图表的特定区域，哪怕是很难理解小细节。我们可以使用所有数据指定图表的所需大小，并在此区域内指定我们想要详细查看的内容，这将在另一个图表中显示。我们可以选择使用鼠标轻松放大或移动此选定区域。
除了允许您自定义大小的工具属性，选择区域等，它还包括事件（指定为属性）OnChanging，它允许您在页面中添加javascript代码。这被指定为文本，并将在Cursor OnChanging事件中实现。
您可以在Features - > JScript - > Scroller中的Features演示中找到示例。
滑块
滑块工具具有与滚动工具类似的功能，允许我们选择要在图表中显示的最大值和最小值，但区别在于它不会创建包含所有数据的另一个图表，但添加了滑块组件在我们指定的位置。这允许我们使用鼠标移动所有图表数据。它还包含属性OnChanging事件。
您可以在功能 - > JScript - >滑块中的Features演示中找到示例。
工具提示
工具提示工具是许多类型图表的必备工具。它允许您在鼠标光标的点经过指定点时显示包含文本的标签（例如值），当光标离开同一点上方的极点时，又使其消失，并隐藏以远离该点。
这允许我们为OnShow事件分配不同的值，并使用相同的属性为OnGetText OnHide分配。
您可以在功能 - > JScript - >工具提示中的Features演示中找到示例。
使用自定义代码增强页面上的图表
由于PHP版本允许我们轻松地将javascript代码添加到我们的页面，添加对teechart.js的引用后，就可以为我们提供使用javascript改进或自定义我们的javascript图表的选项。
在TeeChart for PHP文件夹Docs中，您将找到TeeChart javascript的必要文档，以及开发人员希望在其页面中使用jscript代码的函数。
TeeChart for PHP教程到这里就结束了。