import { CIQ } from "https://jsfiddle.chartiq.com/chart/js/advanced.js";
// Activate the License Key
import getLicenseKey from "https://jsfiddle.chartiq.com/chart/key.js";
getLicenseKey(CIQ);
import quoteFeedSimulator from "https://jsfiddle.chartiq.com/chart/examples/feeds/quoteFeedSimulator.js";
// Declare a CIQ.ChartEngine object. This is the main object for drawing charts.
const stxx = new CIQ.ChartEngine({
container: document.querySelector(".chartContainer")
});
// connect the chart to the feed
stxx.attachQuoteFeed(quoteFeedSimulator, {
refreshInterval: 15
});
stxx.setChartType('line');
// Load the primary chart
stxx.loadChart(
"SPY", null,
function() {
// In the callback, add a series that creates a renderer with a y axis on the left.
// Make sure to give it an explicit name so you can then use it to attach more series to it,
// allowing multiple series to be linked to the same left y-axis.
// Note that all series attached to the same renderer become one group, and will be moved and deleted together.
// So to maintain individuality, you must have a render per series: See https://jsfiddle.net/chartiq/uo97g326/
stxx.addSeries(
"NOK", {
renderer: "Lines", // create a line renderer
//type: "mountain", // of mountain type
yAxis: { // and give it its own y axis
position: "left", // on the left
textStyle: "#0044FF", // with labels of color #0044FF
decimalPlaces: 0, // no decimal places on the labels
maxDecimalPlaces: 0, // and no defimal places on the last price floating label either.
},
name: "left_axis_renderer", // Call the custom renderer "left_axis_renderer", so it can be referenced by other series.
color: "#FFBE00", // Set the line color to "#FFBE00"
//width: 4, // and a width of 4.
display: "NOK Sample", // Finally, use a different display name of "NOK Sample" on the tooltip.
},
...
Please Whitelist JSFiddle in your content blocker.
Help keep JSFiddle free for always by one of two ways:
Whitelist JSFiddle in your content blocker (two clicks)
Go PRO and get access to additional PRO features →
Join the 4+ million users, and keep the JSFiddle dream alive.
Ad-free
All ads in the editor and listing pages are turned completely off.
Use pre-released features
You get to try and use features (like the Palette Color Generator) months before everyone else.
Fiddle collections
Sort and categorize your Fiddles into multiple collections.
Private collections and fiddles
You can make as many Private Fiddles, and Private Collections as you wish!
Console
Debug your Fiddle with a minimal built-in JavaScript console.