JSFiddle - React, Tailwind, and code Playground

by taylorbuley

HTML

<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Gable.js</title>
        <script src="https://raw.github.com/editor/Gable/master/gable.js"></script>
    </head>
    <body>
        <div id='example9'></div>
    </body>
</html>

JavaScript

var data = [
    [ '2008', { 'GDP': -8.9 }, -1.8, -3.7, 1.3 ]
        , [ '2009', -6.7, -6.7, 3.8, 3.8 ]
        , [ '2010', 2.3, 3.9, 2.3, 2.5 ]
];

Gable( 'gdp_candle' )
.add( {
value: data
, meta: {
title: 'U.S. Quarterly GDP By Year'
}
} )
.draw( {
target: 'example9'
, type: 'candlestick'
, meta: {
backgroundColor: '#FDF6E3'
, vAxis: { minValue: -10, maxValue: 10 }
, legend: { position: 'none' }
, titleTextStyle: { color: 'black', fontSize: 14 }
}
} );