FIncentric: Gaps

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:100%;height:400px;position:relative;"></div>

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

JavaScript

import { CIQ } from "https://jsfiddle.chartiq.com/chart/js/advanced.js";
import "https://jsfiddle.chartiq.com/chart/js/extras/hlcbox.js";

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

// instantiate your chart engine and configure defaults
const stxx = new CIQ.ChartEngine({
  container: document.querySelector(".chartContainer"),
   layout: {
    crosshair: true,
    chartType: "baseline_mountain",
    period: 1, 
    interval: 5,
    timeUnit: "minute"
  }
});


stxx.cleanupGaps = "gap";
stxx.setGapLines({ color: "transparent", width: '5px', fillMountain: true });
stxx.loadChart("AAPL", sampleData);