diff --git a/src/plots/cartesian/axis_defaults.js b/src/plots/cartesian/axis_defaults.js index 469c5c677c1..4be59f17630 100644 --- a/src/plots/cartesian/axis_defaults.js +++ b/src/plots/cartesian/axis_defaults.js @@ -6,24 +6,20 @@ * LICENSE file in the root directory of this source tree. */ - 'use strict'; -var colorMix = require('tinycolor2').mix; - var Registry = require('../../registry'); var Lib = require('../../lib'); -var lightFraction = require('../../components/color/attributes').lightFraction; var layoutAttributes = require('./layout_attributes'); var handleTickValueDefaults = require('./tick_value_defaults'); var handleTickMarkDefaults = require('./tick_mark_defaults'); var handleTickLabelDefaults = require('./tick_label_defaults'); var handleCategoryOrderDefaults = require('./category_order_defaults'); +var handleLineGridDefaults = require('./line_grid_defaults'); var setConvert = require('./set_convert'); var orderedCategories = require('./ordered_categories'); - /** * options: object containing: * @@ -40,10 +36,6 @@ module.exports = function handleAxisDefaults(containerIn, containerOut, coerce, var letter = options.letter; var font = options.font || {}; - function coerce2(attr, dflt) { - return Lib.coerce2(containerIn, containerOut, layoutAttributes, attr, dflt); - } - var visible = coerce('visible', !options.cheateronly); var axType = containerOut.type; @@ -84,35 +76,14 @@ module.exports = function handleAxisDefaults(containerIn, containerOut, coerce, handleTickValueDefaults(containerIn, containerOut, coerce, axType); handleTickLabelDefaults(containerIn, containerOut, coerce, axType, options); handleTickMarkDefaults(containerIn, containerOut, coerce, options); + handleLineGridDefaults(containerIn, containerOut, coerce, { + dfltColor: dfltColor, + bgColor: options.bgColor, + showGrid: options.showGrid, + attributes: layoutAttributes + }); - var lineColor = coerce2('linecolor', dfltColor), - lineWidth = coerce2('linewidth'), - showLine = coerce('showline', !!lineColor || !!lineWidth); - - if(!showLine) { - delete containerOut.linecolor; - delete containerOut.linewidth; - } - - if(showLine || containerOut.ticks) coerce('mirror'); - - var gridColor = coerce2('gridcolor', colorMix(dfltColor, options.bgColor, lightFraction).toRgbString()), - gridWidth = coerce2('gridwidth'), - showGridLines = coerce('showgrid', options.showGrid || !!gridColor || !!gridWidth); - - if(!showGridLines) { - delete containerOut.gridcolor; - delete containerOut.gridwidth; - } - - var zeroLineColor = coerce2('zerolinecolor', dfltColor), - zeroLineWidth = coerce2('zerolinewidth'), - showZeroLine = coerce('zeroline', options.showGrid || !!zeroLineColor || !!zeroLineWidth); - - if(!showZeroLine) { - delete containerOut.zerolinecolor; - delete containerOut.zerolinewidth; - } + if(containerOut.showline || containerOut.ticks) coerce('mirror'); return containerOut; }; diff --git a/src/plots/cartesian/line_grid_defaults.js b/src/plots/cartesian/line_grid_defaults.js new file mode 100644 index 00000000000..f51764d738c --- /dev/null +++ b/src/plots/cartesian/line_grid_defaults.js @@ -0,0 +1,63 @@ +/** +* Copyright 2012-2017, 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 colorMix = require('tinycolor2').mix; +var lightFraction = require('../../components/color/attributes').lightFraction; +var Lib = require('../../lib'); + +/** + * @param {object} opts : + * - dfltColor {string} : default axis color + * - bgColor {string} : combined subplot bg color + * - blend {number, optional} : blend percentage (to compute dflt grid color) + * - showLine {boolean} : show line by default + * - showGrid {boolean} : show grid by default + * - noZeroLine {boolean} : don't coerce zeroline* attributes + * - attributes {object} : attribute object associated with input containers + */ +module.exports = function handleLineGridDefaults(containerIn, containerOut, coerce, opts) { + opts = opts || {}; + + var dfltColor = opts.dfltColor; + + function coerce2(attr, dflt) { + return Lib.coerce2(containerIn, containerOut, opts.attributes, attr, dflt); + } + + var lineColor = coerce2('linecolor', dfltColor); + var lineWidth = coerce2('linewidth'); + var showLine = coerce('showline', opts.showLine || !!lineColor || !!lineWidth); + + if(!showLine) { + delete containerOut.linecolor; + delete containerOut.linewidth; + } + + var gridColorDflt = colorMix(dfltColor, opts.bgColor, opts.blend || lightFraction).toRgbString(); + var gridColor = coerce2('gridcolor', gridColorDflt); + var gridWidth = coerce2('gridwidth'); + var showGridLines = coerce('showgrid', opts.showGrid || !!gridColor || !!gridWidth); + + if(!showGridLines) { + delete containerOut.gridcolor; + delete containerOut.gridwidth; + } + + if(!opts.noZeroLine) { + var zeroLineColor = coerce2('zerolinecolor', dfltColor); + var zeroLineWidth = coerce2('zerolinewidth'); + var showZeroLine = coerce('zeroline', opts.showGrid || !!zeroLineColor || !!zeroLineWidth); + + if(!showZeroLine) { + delete containerOut.zerolinecolor; + delete containerOut.zerolinewidth; + } + } +}; diff --git a/src/plots/polar/layout_defaults.js b/src/plots/polar/layout_defaults.js index cc659cca7ef..6b7d3bf97a0 100644 --- a/src/plots/polar/layout_defaults.js +++ b/src/plots/polar/layout_defaults.js @@ -8,8 +8,6 @@ 'use strict'; -var colorMix = require('tinycolor2').mix; - var Lib = require('../../lib'); var Color = require('../../components/color'); var Plots = require('../plots'); @@ -20,6 +18,7 @@ var handleTickValueDefaults = require('../cartesian/tick_value_defaults'); var handleTickMarkDefaults = require('../cartesian/tick_mark_defaults'); var handleTickLabelDefaults = require('../cartesian/tick_label_defaults'); var handleCategoryOrderDefaults = require('../cartesian/category_order_defaults'); +var handleLineGridDefaults = require('../cartesian/line_grid_defaults'); var autoType = require('../cartesian/axis_autotype'); var orderedCategories = require('../cartesian/ordered_categories'); var setConvert = require('../cartesian/set_convert'); @@ -69,10 +68,17 @@ function handleDefaults(contIn, contOut, coerce, opts) { handleCalendarDefaults(axIn, axOut, 'calendar', layoutOut.calendar); } - coerceAxis('visible'); - + var visible = coerceAxis('visible'); setConvert(axOut, layoutOut); + var dfltColor; + var dfltFontColor; + + if(visible) { + dfltColor = coerceAxis('color'); + dfltFontColor = (dfltColor === axIn.color) ? dfltColor : opts.font.color; + } + // We don't want to make downstream code call ax.setScale, // as both radial and angular axes don't have a set domain. // Furthermore, angular axes don't have a set range. @@ -89,11 +95,13 @@ function handleDefaults(contIn, contOut, coerce, opts) { coerceAxis('range'); axOut.cleanRange('range', {dfltRange: [0, 1]}); - if(axOut.visible) { + if(visible) { coerceAxis('side'); coerceAxis('position', sector[0]); + } break; + case 'angularaxis': if(axType === 'linear') { coerceAxis('thetaunit'); @@ -111,10 +119,42 @@ function handleDefaults(contIn, contOut, coerce, opts) { break; } - if(axOut.visible) { - handleAxisStyleDefaults(axIn, axOut, coerceAxis, opts); + if(visible) { + handleTickValueDefaults(axIn, axOut, coerceAxis, axOut.type); + handleTickLabelDefaults(axIn, axOut, coerceAxis, axOut.type, { + noHover: false, + tickSuffixDflt: axOut.thetaunit === 'degrees' ? '°' : undefined + }); + handleTickMarkDefaults(axIn, axOut, coerceAxis, {outerTicks: true}); + + var showTickLabels = coerceAxis('showticklabels'); + if(showTickLabels) { + Lib.coerceFont(coerceAxis, 'tickfont', { + family: opts.font.family, + size: opts.font.size, + color: dfltFontColor + }); + coerceAxis('tickangle'); + coerceAxis('tickformat'); + } + + handleLineGridDefaults(axIn, axOut, coerceAxis, { + dfltColor: dfltColor, + bgColor: opts.bgColor, + // default grid color is darker here (60%, vs cartesian default ~91%) + // because the grid is not square so the eye needs heavier cues to follow + blend: 60, + showLine: true, + showGrid: true, + noZeroLine: true, + attributes: layoutAttributes[axName] + }); + + coerceAxis('layer'); } + coerceAxis('hoverformat'); + axOut._input = axIn; } } @@ -151,47 +191,6 @@ function handleAxisTypeDefaults(axIn, axOut, coerce, subplotData, dataAttr) { return axOut.type; } -function handleAxisStyleDefaults(axIn, axOut, coerce, opts) { - var dfltColor = coerce('color'); - var dfltFontColor = (dfltColor === axIn.color) ? dfltColor : opts.font.color; - - handleTickValueDefaults(axIn, axOut, coerce, axOut.type); - handleTickLabelDefaults(axIn, axOut, coerce, axOut.type, { - noHover: false, - tickSuffixDflt: axOut.thetaunit === 'degrees' ? '°' : undefined - }); - handleTickMarkDefaults(axIn, axOut, coerce, {outerTicks: true}); - - var showTickLabels = coerce('showticklabels'); - if(showTickLabels) { - Lib.coerceFont(coerce, 'tickfont', { - family: opts.font.family, - size: opts.font.size, - color: dfltFontColor - }); - coerce('tickangle'); - coerce('tickformat'); - } - - // TODO should use coerce2 pattern !! - - var showLine = coerce('showline'); - if(showLine) { - coerce('linecolor', dfltColor); - coerce('linewidth'); - } - - var showGridLines = coerce('showgrid'); - if(showGridLines) { - // default grid color is darker here (60%, vs cartesian default ~91%) - // because the grid is not square so the eye needs heavier cues to follow - coerce('gridcolor', colorMix(dfltColor, opts.bgColor, 60).toRgbString()); - coerce('gridwidth'); - } - - coerce('layer'); -} - module.exports = function supplyLayoutDefaults(layoutIn, layoutOut, fullData) { handleSubplotDefaults(layoutIn, layoutOut, fullData, { type: constants.name, diff --git a/src/plots/ternary/layout/axis_defaults.js b/src/plots/ternary/layout/axis_defaults.js index 0a02d2260b5..bf015c0eb2b 100644 --- a/src/plots/ternary/layout/axis_defaults.js +++ b/src/plots/ternary/layout/axis_defaults.js @@ -6,20 +6,16 @@ * LICENSE file in the root directory of this source tree. */ - 'use strict'; -var colorMix = require('tinycolor2').mix; var Lib = require('../../../lib'); - var layoutAttributes = require('./axis_attributes'); var handleTickLabelDefaults = require('../../cartesian/tick_label_defaults'); var handleTickMarkDefaults = require('../../cartesian/tick_mark_defaults'); var handleTickValueDefaults = require('../../cartesian/tick_value_defaults'); - +var handleLineGridDefaults = require('../../cartesian/line_grid_defaults'); module.exports = function supplyLayoutDefaults(containerIn, containerOut, options) { - function coerce(attr, dflt) { return Lib.coerce(containerIn, containerOut, layoutAttributes, attr, dflt); } @@ -64,21 +60,18 @@ module.exports = function supplyLayoutDefaults(containerIn, containerOut, option coerce('tickformat'); } - coerce('hoverformat'); - - var showLine = coerce('showline'); - if(showLine) { - coerce('linecolor', dfltColor); - coerce('linewidth'); - } - - var showGridLines = coerce('showgrid'); - if(showGridLines) { + handleLineGridDefaults(containerIn, containerOut, coerce, { + dfltColor: dfltColor, + bgColor: options.bgColor, // default grid color is darker here (60%, vs cartesian default ~91%) // because the grid is not square so the eye needs heavier cues to follow - coerce('gridcolor', colorMix(dfltColor, options.bgColor, 60).toRgbString()); - coerce('gridwidth'); - } + blend: 60, + showLine: true, + showGrid: true, + noZeroLine: true, + attributes: layoutAttributes + }); + coerce('hoverformat'); coerce('layer'); };