Customize Chart Colors

by sonylnagale

HTML

<link rel="stylesheet" href="https://jsfiddle.chartiq.com/chart/css/stx-chart.css">
<div class="chartContainer" style="width:100%;height:400px;position:relative;"></div>

<script src="https://jsfiddle.chartiq.com/chart/js/chartiq.js"></script>

JavaScript

const stxx = new CIQ.ChartEngine({ container: document.querySelector('.chartContainer'), 
	layout: {
  	chartType: "line"
  },
  controls: {
  	dragOk: false
  }
})

const data = [{
  "Date": "1992-06-29",
  "Open": 43.97,
  "High": 43.97,
  "Low": 43.75,
  "Close": 43.94,
  "Volume": 1003200,
  "Adj_Close": 40.16
}, {
  "Date": "1993-01-29",
  "Open": 43.97,
  "High": 43.97,
  "Low": 43.75,
  "Close": 43.94,
  "Volume": 1003200,
  "Adj_Close": 31.16
}, {
  "Date": "1993-02-01",
  "Open": 43.97,
  "High": 44.25,
  "Low": 43.97,
  "Close": 44.25,
  "Volume": 480500,
  "Adj_Close": 31.38
}, {
  "Date": "1993-02-02",
  "Open": 44.22,
  "High": 44.38,
  "Low": 44.13,
  "Close": 44.34,
  "Volume": 201300,
  "Adj_Close": 31.44
}, {
  "Date": "1993-02-03",
  "Open": 44.41,
  "High": 44.84,
  "Low": 44.38,
  "Close": 44.81,
  "Volume": 529400,
  "Adj_Close": 31.77
}, {
  "Date": "1993-02-04",
  "Open": 44.97,
  "High": 45.09,
  "Low": 44.47,
  "Close": 45,
  "Volume": 531500,
  "Adj_Close": 31.91
}, {
  "Date": "1993-02-05",
  "Open": 44.97,
  "High": 45.06,
  "Low": 44.72,
  "Close": 44.97,
  "Volume": 492100,
  "Adj_Close": 31.89
}, {
  "Date": "1993-02-08",
  "Open": 44.97,
  "High": 45.13,
  "Low": 44.91,
  "Close": 44.97,
  "Volume": 596100,
  "Adj_Close": 31.89
}, {
  "Date": "1993-02-09",
  "Open": 44.81,
  "High": 44.81,
  "Low": 44.56,
  "Close": 44.66,
  "Volume": 122100,
  "Adj_Close": 31.67
}, {
  "Date": "1993-02-10",
  "Open": 44.66,
  "High": 44.75,
  "Low": 44.53,
  "Close": 44.72,
  "Volume": 379600,
  "Adj_Close": 31.71
}]


const data2 = [{
  "Date": "1993-01-29",
  "Open": 43.97,
  "High": 90.97,
  "Low": 43.75,
  "Close": 90.94,
  "Volume": 1003200,
  "Adj_Close": 35.16
}, {
  "Date": "1993-02-01",
  "Open": 43.97,
  "High": 44.25,
  "Low": 43.97,
  "Close": 80.25,
  "Volume": 480500,
  "Adj_Close": 37.38
}, /*{
  "Date": "1993-02-02",
  "Open": 44.22,
  "High": 44.38,
  "Low": 44.13,
  "Close": 95.34,
  "Volume": 201300,
  "Adj_Close": 31.44
}, */...