Anychart/Anystock技术指标

Question

我有一个每日股票投资组合价格的折线图，但我们也希望显示在选定的时间内每日价格的变化百分比。我在Technical Indicators中找到了Rate of Change(ROC)，但它需要一个周期来定义，我希望它所比较的价格是一系列数据中的第一个价格。有没有办法做到这一点？提前感谢您的帮助。

更新:在文档中看了一下之后，看起来comparisonMode("percent")将会做我想要的数学上明智的事情，但是我还没能想出一种方法来绘制结果，而不是仅仅创建一个y轴值。

Answer 1

是的，为此，AnyStock提供了比较模式。比较模式不会影响线的序列形状或其他任何东西。例如，它提供了与系列中的第一价格相比较的重新计算价值(可以使用其他模式)。您可以在下面找到一个示例，其中显示了如何使用比较模式。此外，您还可以了解有关this article中比较模式的更多信息

​

anychart.onDocumentReady(function () {
    
    var dataTable = anychart.data.table();
    // data comes from the function in https://cdn.anychart.com/csv-data/dji-daily-short.js
    dataTable.addData(get_dji_daily_short_data());

    var firstMapping = dataTable.mapAs({value: 1});

    var chart = anychart.stock();
    chart.padding(10, 10, 10, 50);

    var nonePlot = chart.plot(0);
    nonePlot.line(firstMapping);
    nonePlot.legend().titleFormat(function (){return "comparisonMode='none'"});
    // Set comparison mode to 'none'
    nonePlot.yScale().comparisonMode("none");

    var valuePlot = chart.plot(1);
    var valueSeries = valuePlot.line(firstMapping);
    valuePlot.legend().titleFormat(function (){return "comparisonMode='value'"});
	valuePlot.legend().itemsFormat(function () {
        return "Value: " + anychart.format.number(this.valueChange, 3, ".", "") ;
    });
  valueSeries.tooltip().format(function() {
  	return 'Value change: ' + anychart.format.number(this.valueChange, 3, ".", "") ;
  });
    // Set comparison mode 'value'
    valuePlot.yScale().comparisonMode("value");

    var percentPlot = chart.plot(2);
   var percentSeries = percentPlot.line(firstMapping);
    percentPlot.legend().titleFormat(function (){return "comparisonMode='percent'"});
  	percentPlot.legend().itemsFormat(function () {
        return "Value: " + this.valuePercentChange + '%';
    });
    percentSeries.tooltip().format(function() {
  	return 'Percent change: ' + this.valuePercentChange + '%';
  });
    percentPlot.yAxis().labels().format("{%value}%");
    // Set comparison mode to 'percent'
    percentPlot.yScale().comparisonMode("percent");

    chart.title("Stock: Different Comparison Modes");
    chart.container("container");
    chart.draw();
});

html, body, #container {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-base.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-ui.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-exports.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-stock.min.js"></script>

<script src="https://cdn.anychart.com/csv-data/dji-daily-short.js"></script>
<link href="https://cdn.anychart.com/releases/8.1.0/css/anychart-ui.min.css" rel="stylesheet"/>
<div id="container"></div>

​