Helloworld with custom study

Sample of how to create a custom study calculation using the default line rendering function.

by sonylnagale

HTML

<link rel="stylesheet" type="text/css" href="https://jsfiddle.chartiq.com/chart/css/stx-chart.css" media="screen" />

<div class="chartContainer" style="width:600px;height:400px;position:relative;"></div>

JavaScript

import { CIQ } from "https://jsfiddle.chartiq.com/chart/js/advanced.js";
import sampleData from "https://jsfiddle.chartiq.com/chart/examples/data/STX_SAMPLE_DAILY.js";

// Activate the License Key
import getLicenseKey from "https://jsfiddle.chartiq.com/chart/key.js";
getLicenseKey(CIQ);


const SampleStudy = {
	name: "Sample",
  overlay:true,
  // note no display function is set, 
  // so the default (https://documentation.chartiq.com/CIQ.Studies.html#.displaySeriesAsLine) 
  // will be used to draw simple lines.
  calculateFN: (stx, sd) => {
    const quotes = sd.chart.scrubbed;
    console.log(sd.days)

    if (quotes.length < sd.days + 1) {
      // not enough data
      sd.error = true;
      return;
    }

    // iterate trough the raw data and create the required values for the display function to use
    for (let i = sd.startFrom; i < quotes.length; i++) {
      if (!quotes[i]) continue;
      if (!quotes[i].Close) continue;

      // make sure field name complies with 
      // default function https://documentation.chartiq.com/CIQ.Studies.html#.displaySeriesAsLine
      quotes[i]["line1" + " " + sd.name] = quotes[i].Close + 1;
      quotes[i]["line2" + " " + sd.name] = quotes[i].Close + 2;
      quotes[i]["line3" + " " + sd.name] = quotes[i].Close + 3;
      quotes[i]["line4" + " " + sd.name] = quotes[i].Close + 4;
      quotes[i]["line5" + " " + sd.name] = quotes[i].Close + 5;
      quotes[i]["line6" + " " + sd.name] = quotes[i].Close + 6;
      quotes[i]["line7" + " " + sd.name] = quotes[i].Close + 7;
      quotes[i]["line8" + " " + sd.name] = quotes[i].Close + 8;
      quotes[i]["line9" + " " + sd.name] = quotes[i].Close + 9;
      quotes[i]["line10" + " " + sd.name] = quotes[i].Close + 10;
    }

  },
  inputs: {
    Period: 14
  },
  outputs: {
    line1: {
      color: "#FF0000",
      width: 10,
      pattern: "dashed"
    },
    line2: {
      color: "#00FF00",
      width: 10,
      pattern: "dotted"
    },
    line3: "#FFFF00",
    line4:...