彩票走势图

跨平台图表控件Anychart教程:通过四个简单步骤制作JS烛台图(下)

翻译|使用教程|编辑:吴园园|2020-04-02 09:38:45.287|阅读 191 次

概述:完成本教程,您将可以轻松,快速,真正地用JavaScript创建引人注目的交互式烛台图。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

相关链接:

AnyChart是基于JavaScript (HTML5) 的图表控件。使用AnyChart控件,可创建跨浏览器和跨平台的交互式图表和仪表。AnyChart 图表目前已被很多知名大公司所使用,可用于仪表盘、报表、数据分析、统计学、金融等领域。重要推荐:

点击下载Anychart最新试用版

JS烛台图定制

  1. 添加EMA指标以进行技术分析。
  2. 修改烛台颜色。
  3. 配置滚动条系列。

添加EMA技术指标

因此,您已经在JS中建立了具有预定义样式和功能的基本烛台图。但是,如果需要,您可以轻松更改很多事情。

现在,我将向您展示如何通过以下方式对其进行自定义:

EMA代表指数移动平均线。它是基于数学公式来赋予最新观察更多的重视和重要性,它是在金融图表中广泛用于分析数据的技术指标。根据情况,交易者可能希望使用不同的EMA周期。例如,20天,30天和90天移动平均线。

AnyStock已经具有添加EMA所需的代码。因此,您只需将其插入烛台图表并指定要使用的期限即可。像这样:

// create a plot
var plot = chart.plot(0);

// create an EMA indicator with period 20
var ema20 = plot.ema(mapping, 20).series();

// set the EMA color
ema20.stroke('#bf360c');
这里的结果:

修改烛台颜色

如果要使用白色和黑色对价格的涨跌进行编码,只需添加以下几行:

// modify the color of candlesticks making them black and white
series.fallingFill("black");
series.fallingStroke("black");
series.risingFill("white");
series.risingStroke("black");
这里的结果:

配置滚动条系列

当前,日期同时显示在默认的X轴和滚动条上。您可以按以下方式禁用额外的X轴:

chart.scroller().xAxis(false);
现在,让我们open在滚动条中将值绘制  为列系列。首先,创建一个变量以open仅存储值:

openValue = dataTable.mapAs();
openValue.addField('value', 2);
其次,仅用一行代码,使用映射的数据创建一个滚动条系列:

chart.scroller().column(openValue);
这是结果:

跨平台图表控件Anychart教程:通过四个简单步骤制作JS烛台图(下)

结论

在专用的JavaScript库的帮助下为应用程序和网站创建交互式图表以进行数据可视化并不复杂,不是吗?实际上,即使是新手,也可以创建符合他们需求的专业外观交互式图表。

在本教程中,我试图显示制作您自己的第一个JS烛台图所需的四个简单步骤,希望对您有所帮助。

=====================================================

想要购买Anychart正版授权的朋友可以

更多精彩内容,欢迎关注下方的微信公众号,及时获取产品最新资讯▼▼▼

跨平台图表控件Anychart教程:通过四个简单步骤制作JS烛台图(下)


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn

文章转载自:

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP