OHLC and Candlestick trace types

lib/candlestick.js

@@ -0,0 +1,11 @@
+/**
+* Copyright 2012-2016, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+module.exports = require('../src/traces/candlestick');

lib/index-finance.js

@@ -0,0 +1,21 @@
+/**
+* Copyright 2012-2016, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+var Plotly = require('./core');
+
+Plotly.register([
+    require('./bar'),
+    require('./histogram'),
+    require('./pie'),
+    require('./ohlc'),
+    require('./candlestick')
+]);
+
+module.exports = Plotly;

lib/index.js

@@ -20,15 +20,22 @@ Plotly.register([
     require('./histogram2dcontour'),
     require('./pie'),
     require('./contour'),
+    require('./scatterternary'),
+
     require('./scatter3d'),
     require('./surface'),
     require('./mesh3d'),
+
     require('./scattergeo'),
     require('./choropleth'),
+
     require('./scattergl'),
     require('./pointcloud'),
-    require('./scatterternary'),
-    require('./scattermapbox')
+
+    require('./scattermapbox'),
+
+    require('./ohlc'),
+    require('./candlestick')
 ]);
 
 // transforms

lib/ohlc.js

@@ -0,0 +1,11 @@
+/**
+* Copyright 2012-2016, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+module.exports = require('../src/traces/ohlc');

src/components/legend/draw.js

@@ -367,10 +367,28 @@ function drawTexts(g, gd) {
             .call(textLayout)
             .on('edit', function(text) {
                 this.attr({'data-unformatted': text});
+
                 this.text(text)
                     .call(textLayout);
+
                 if(!this.text()) text = ' \u0020\u0020 ';
-                Plotly.restyle(gd, 'name', text, traceIndex);
+
+                var fullInput = legendItem.trace._fullInput || {},
+                    astr;
+
+                // N.B. this block isn't super clean,
+                // is unfortunately untested at the moment,
+                // and only works for for 'ohlc' and 'candlestick',
+                // but should be generalized for other one-to-many transforms
+                if(['ohlc', 'candlestick'].indexOf(fullInput.type) !== -1) {
+                    var transforms = legendItem.trace.transforms,
+                        direction = transforms[transforms.length - 1].direction;
+
+                    astr = direction + '.legenditem.name';
+                }
+                else astr = 'name';
+
+                Plotly.restyle(gd, astr, text, traceIndex);
             });
     }
     else text.call(textLayout);

src/lib/coerce.js

@@ -457,5 +457,19 @@ exports.findArrayAttributes = function(trace) {
 
     exports.crawl(trace._module.attributes, callback);
 
+    // Look into the fullInput module attributes for array attributes
+    // to make sure that 'custom' array attributes are detected.
+    //
+    // At the moment, we need this block to make sure that
+    // ohlc and candlestick 'open', 'high', 'low', 'close' can be
+    // used with filter ang groupby transforms.
+    if(trace._fullInput) {
+        exports.crawl(trace._fullInput._module.attributes, callback);
+
+        arrayAttributes = arrayAttributes.filter(function(g, i, self) {
+            return self.indexOf(g) === i;
+        });
+    }
+
     return arrayAttributes;
 };

src/plot_api/plot_api.js

@@ -140,7 +140,7 @@ Plotly.plot = function(gd, data, layout, config) {
 
     // generate calcdata, if we need to
     // to force redoing calcdata, just delete it before calling Plotly.plot
-    var recalc = !gd.calcdata || gd.calcdata.length !== (gd.data || []).length;
+    var recalc = !gd.calcdata || gd.calcdata.length !== (gd._fullData || []).length;
     if(recalc) Plots.doCalcdata(gd);
 
     // in case it has changed, attach fullData traces to calcdata
@@ -1245,6 +1245,7 @@ function _restyle(gd, aobj, _traces) {
         'histfunc', 'histnorm', 'text',
         'x', 'y', 'z',
         'a', 'b', 'c',
+        'open', 'high', 'low', 'close',
         'xtype', 'x0', 'dx', 'ytype', 'y0', 'dy', 'xaxis', 'yaxis',
         'line.width',
         'connectgaps', 'transpose', 'zsmooth',
@@ -1287,7 +1288,8 @@ function _restyle(gd, aobj, _traces) {
     // TODO: could we break this out as well?
     var autorangeAttrs = [
         'marker', 'marker.size', 'textfont',
-        'boxpoints', 'jitter', 'pointpos', 'whiskerwidth', 'boxmean'
+        'boxpoints', 'jitter', 'pointpos', 'whiskerwidth', 'boxmean',
+        'tickwidth'
     ];
 
     // replotAttrs attributes need a replot (because different

src/plots/plots.js

@@ -369,7 +369,7 @@ plots.supplyDefaults = function(gd) {
 
     // then do the data
     newFullLayout._globalTransforms = (gd._context || {}).globalTransforms;
-    plots.supplyDataDefaults(newData, newFullData, newFullLayout);
+    plots.supplyDataDefaults(newData, newFullData, newLayout, newFullLayout);
 
     // attach helper method to check whether a plot type is present on graph
     newFullLayout._has = plots._hasPlotType.bind(newFullLayout);
@@ -530,7 +530,7 @@ function relinkPrivateKeys(toContainer, fromContainer) {
     var isPlainObject = Lib.isPlainObject,
         isArray = Array.isArray;
 
-    var keys = Object.keys(fromContainer);
+    var keys = Object.keys(fromContainer || {});
 
     for(var i = 0; i < keys.length; i++) {
         var k = keys[i],
@@ -593,9 +593,9 @@ plots.linkSubplots = function(newFullData, newFullLayout, oldFullData, oldFullLa
     }
 };
 
-plots.supplyDataDefaults = function(dataIn, dataOut, layout) {
-    var modules = layout._modules = [],
-        basePlotModules = layout._basePlotModules = [],
+plots.supplyDataDefaults = function(dataIn, dataOut, layout, fullLayout) {
+    var modules = fullLayout._modules = [],
+        basePlotModules = fullLayout._basePlotModules = [],
         cnt = 0;
 
     function pushModule(fullTrace) {
@@ -612,18 +612,18 @@ plots.supplyDataDefaults = function(dataIn, dataOut, layout) {
 
     for(var i = 0; i < dataIn.length; i++) {
         var trace = dataIn[i],
-            fullTrace = plots.supplyTraceDefaults(trace, cnt, layout);
+            fullTrace = plots.supplyTraceDefaults(trace, cnt, fullLayout);
 
         fullTrace.index = i;
         fullTrace._input = trace;
         fullTrace._expandedIndex = cnt;
 
         if(fullTrace.transforms && fullTrace.transforms.length) {
-            var expandedTraces = applyTransforms(fullTrace, dataOut, layout);
+            var expandedTraces = applyTransforms(fullTrace, dataOut, layout, fullLayout);
 
             for(var j = 0; j < expandedTraces.length; j++) {
                 var expandedTrace = expandedTraces[j],
-                    fullExpandedTrace = plots.supplyTraceDefaults(expandedTrace, cnt, layout);
+                    fullExpandedTrace = plots.supplyTraceDefaults(expandedTrace, cnt, fullLayout);
 
                 // mutate uid here using parent uid and expanded index
                 // to promote consistency between update calls
@@ -816,7 +816,7 @@ function supplyTransformDefaults(traceIn, traceOut, layout) {
     }
 }
 
-function applyTransforms(fullTrace, fullData, layout) {
+function applyTransforms(fullTrace, fullData, layout, fullLayout) {
     var container = fullTrace.transforms,
         dataOut = [fullTrace];
 
@@ -830,6 +830,7 @@ function applyTransforms(fullTrace, fullData, layout) {
                 fullTrace: fullTrace,
                 fullData: fullData,
                 layout: layout,
+                fullLayout: fullLayout,
                 transformIndex: i
             });
         }

src/traces/candlestick/attributes.js

@@ -0,0 +1,42 @@
+/**
+* Copyright 2012-2016, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+
+'use strict';
+
+var Lib = require('../../lib');
+var OHLCattrs = require('../ohlc/attributes');
+var boxAttrs = require('../box/attributes');
+
+var directionAttrs = {
+    name: OHLCattrs.increasing.name,
+    showlegend: OHLCattrs.increasing.showlegend,
+
+    color: Lib.extendFlat({}, boxAttrs.line.color),
+    width: Lib.extendFlat({}, boxAttrs.line.width),
+    fillcolor: Lib.extendFlat({}, boxAttrs.fillcolor),
+};
+
+module.exports = {
+    x: OHLCattrs.x,
+    open: OHLCattrs.open,
+    high: OHLCattrs.high,
+    low: OHLCattrs.low,
+    close: OHLCattrs.close,
+
+    increasing: Lib.extendDeep({}, directionAttrs, {
+        color: { dflt: OHLCattrs.increasing.color.dflt }
+    }),
+
+    decreasing: Lib.extendDeep({}, directionAttrs, {
+        color: { dflt: OHLCattrs.decreasing.color.dflt }
+    }),
+
+    text: OHLCattrs.text,
+    whiskerwidth: Lib.extendFlat({}, boxAttrs.whiskerwidth, { dflt: 0 }),
+};

src/traces/candlestick/defaults.js

@@ -0,0 +1,44 @@
+/**
+* Copyright 2012-2016, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+
+'use strict';
+
+var Lib = require('../../lib');
+var handleOHLC = require('../ohlc/ohlc_defaults');
+var handleDirectionDefaults = require('../ohlc/direction_defaults');
+var helpers = require('../ohlc/helpers');
+var attributes = require('./attributes');
+
+module.exports = function supplyDefaults(traceIn, traceOut) {
+    helpers.pushDummyTransformOpts(traceIn, traceOut);
+
+    function coerce(attr, dflt) {
+        return Lib.coerce(traceIn, traceOut, attributes, attr, dflt);
+    }
+
+    var len = handleOHLC(traceIn, traceOut, coerce);
+    if(len === 0) {
+        traceOut.visible = false;
+        return;
+    }
+
+    coerce('text');
+    coerce('whiskerwidth');
+
+    handleDirection(traceIn, traceOut, coerce, 'increasing');
+    handleDirection(traceIn, traceOut, coerce, 'decreasing');
+};
+
+function handleDirection(traceIn, traceOut, coerce, direction) {
+    handleDirectionDefaults(traceIn, traceOut, coerce, direction);
+
+    coerce(direction + '.color');
+    coerce(direction + '.width');
+    coerce(direction + '.fillcolor');
+}

src/traces/candlestick/index.js

@@ -0,0 +1,40 @@
+/**
+* Copyright 2012-2016, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+
+'use strict';
+
+var register = require('../../plot_api/register');
+
+module.exports = {
+    moduleType: 'trace',
+    name: 'candlestick',
+    basePlotModule: require('../../plots/cartesian'),
+    categories: ['cartesian', 'showLegend'],
+    meta: {
+        description: [
+            'The candlestick is a style of financial chart describing',
+            'open, high, low and close for a given `x` coordinate (most likely time).',
+
+            'The boxes represent the spread between the `open` and `close` values and',
+            'the lines represent the spread between the `low` and `high` values',
+
+            'Sample points where the close value is higher (lower) then the open',
+            'value are called increasing (decreasing).',
+
+            'By default, increasing candles are drawn in green whereas',
+            'decreasing are drawn in red.'
+        ].join(' ')
+    },
+
+    attributes: require('./attributes'),
+    supplyDefaults: require('./defaults'),
+};
+
+register(require('../box'));
+register(require('./transform'));