From 0695efb48a4924b5eb2325382add0a9d69d4945f Mon Sep 17 00:00:00 2001 From: soumak77 Date: Sun, 25 Mar 2018 14:44:52 -0700 Subject: [PATCH] move common code to utils --- src/d3-renderers/utils.js | 23 ++++++++++- .../v3/personality-chart-renderer.js | 41 ++----------------- .../v4/personality-chart-renderer.js | 40 ++---------------- 3 files changed, 30 insertions(+), 74 deletions(-) diff --git a/src/d3-renderers/utils.js b/src/d3-renderers/utils.js index 2a7d7f0..7ef3fd9 100644 --- a/src/d3-renderers/utils.js +++ b/src/d3-renderers/utils.js @@ -51,9 +51,30 @@ function getValue(d, prop) { return d.data ? d.data[prop] : d[prop]; } +function getBarLengthFactor(d) { + var bar_length_factor = 10 / (d.depth - 2); + + //different bar_length factors + if (d.parent) { + if (d.parent.parent) { + if (getValue(d.parent.parent, 'id') === 'needs' || getValue(d.parent.parent, 'id') === 'values') { + bar_length_factor = 1; + } + if (d.parent.parent.parent) { + if (getValue(d.parent.parent.parent, 'id') === 'personality') { + bar_length_factor = 1; + } + } + } + } + + return bar_length_factor; +} + module.exports = { isLocatedBottom: isLocatedBottom, arc: arc, expandOrFoldSector: expandOrFoldSector, - getValue: getValue + getValue: getValue, + getBarLengthFactor: getBarLengthFactor }; diff --git a/src/d3-renderers/v3/personality-chart-renderer.js b/src/d3-renderers/v3/personality-chart-renderer.js index 756f5e6..765fcc8 100644 --- a/src/d3-renderers/v3/personality-chart-renderer.js +++ b/src/d3-renderers/v3/personality-chart-renderer.js @@ -13,7 +13,6 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -/* global alert */ 'use strict'; const d3 = require('d3'); Object.assign(d3, @@ -24,9 +23,7 @@ const d3SvgSingleArc = require('../svg-single-arc'); const utils = require('../utils'); function renderChart(widget) { - console.debug('personality-chart-renderer: defining renderChart'); - if (!widget.data) { - console.debug('personality-chart-renderer: data not defined.'); + if (!widget.data || !widget.loadingDiv) { return; } @@ -36,11 +33,6 @@ function renderChart(widget) { return; } - if (!widget.loadingDiv) { - alert('Widget is not fully initialized, cannot render BarsWidget'); - return; - } - widget.switchState(1); widget._layout(); @@ -58,23 +50,8 @@ function renderChart(widget) { var score = widget.getScore(d); if (!d.children) { - var bar_length_factor = 10 / (d.depth - 2); - - //different bar_length factors - if (d.parent) { - if (d.parent.parent) { - if (utils.getValue(d.parent.parent, 'id') === 'needs' || utils.getValue(d.parent.parent, 'id') === 'values') { - bar_length_factor = 1; - } - if (d.parent.parent.parent) - if (utils.getValue(d.parent.parent.parent, 'id') === 'personality') bar_length_factor = 1; - } else { - console.debug(d.name + ': Parent is null!'); - } - } - var inner_r = sector_bottom_pad + d.y; - var out_r = sector_bottom_pad + d.y + bar_length_factor * Math.abs(score) * d.dy; + var out_r = sector_bottom_pad + d.y + utils.getBarLengthFactor(d) * Math.abs(score) * d.dy; var _bar = d3.svg.arc() .startAngle(d.x) @@ -100,16 +77,8 @@ function renderChart(widget) { dy_init = 5 + d.dx * 20 * Math.PI; } - var max_label_size = 13, - lable_size = 10; - - if ((7.5 + 15 * Math.PI * d.dx) > max_label_size) { - lable_size = max_label_size; - } - widget._childElements.parts[widget.getUniqueId(d, 'sector_leaf_text')] .attr('dy', dy_init) - .attr('font-size', lable_size) .attr('text-anchor', lbl_anchor) .attr('transform', 'translate(' + (out_r + 5) * Math.sin(d.x) + ',' + (-(out_r + 5) * Math.cos(d.x)) + ') ' + 'rotate(' + rotate + ')'); } else { @@ -202,15 +171,13 @@ function renderChart(widget) { return twoArcs; } - var width = widget.dimW, - height = widget.dimH; // The flower had a radius of 640 / 1.9 = 336.84 in the original. - var radius = Math.min(width, height) / 3.2; + var radius = Math.min(widget.dimW, widget.dimH) / 3.2; var sector = twoArcsRender(radius); // Center the graph of 'g' widget.vis = widget.d3vis.append('g') - .attr('transform', 'translate(' + (width / 2) + ',' + height / 2 + ')') + .attr('transform', 'translate(' + (widget.dimW / 2) + ',' + widget.dimH / 2 + ')') .append('g'); var profile = { diff --git a/src/d3-renderers/v4/personality-chart-renderer.js b/src/d3-renderers/v4/personality-chart-renderer.js index 4cb2668..6c4964d 100644 --- a/src/d3-renderers/v4/personality-chart-renderer.js +++ b/src/d3-renderers/v4/personality-chart-renderer.js @@ -13,7 +13,6 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -/* global alert */ 'use strict'; const d3 = Object.assign({}, require('d3-color'), @@ -26,8 +25,7 @@ const d3SvgSingleArc = require('../svg-single-arc'); const utils = require('../utils'); function renderChart(widget) { - if (!widget.data) { - console.error('personality-chart-renderer: data not defined.'); + if (!widget.data || !widget.loadingDiv) { return; } @@ -37,11 +35,6 @@ function renderChart(widget) { return; } - if (!widget.loadingDiv) { - alert('Widget is not fully initialized, cannot render BarsWidget'); - return; - } - widget.switchState(1); widget._layout(); @@ -59,23 +52,8 @@ function renderChart(widget) { var score = widget.getScore(d); if (!d.children) { - var bar_length_factor = 10 / (d.depth - 2); - - //different bar_length factors - if (d.parent) { - if (d.parent.parent) { - if (utils.getValue(d.parent.parent, 'id') === 'needs' || utils.getValue(d.parent.parent, 'id') === 'values') { - bar_length_factor = 1; - } - if (d.parent.parent.parent) - if (utils.getValue(d.parent.parent.parent, 'id') === 'personality') bar_length_factor = 1; - } else { - console.debug(d.name + ': Parent is null!'); - } - } - var inner_r = sector_bottom_pad + d.y0; - var out_r = sector_bottom_pad + d.y0 + bar_length_factor * Math.abs(score) * (d.y1 - d.y0); + var out_r = sector_bottom_pad + d.y0 + utils.getBarLengthFactor(d) * Math.abs(score) * (d.y1 - d.y0); var _bar = d3.arc() .startAngle(d.x0) @@ -101,16 +79,8 @@ function renderChart(widget) { dy_init = 5 + (d.x1 - d.x0) * 20 * Math.PI; } - var max_label_size = 13, - lable_size = 10; - - if ((7.5 + 15 * Math.PI * (d.x1 - d.x0)) > max_label_size) { - lable_size = max_label_size; - } - widget._childElements.parts[widget.getUniqueId(d, 'sector_leaf_text')] .attr('dy', dy_init) - .attr('font-size', lable_size) .attr('text-anchor', lbl_anchor) .attr('transform', 'translate(' + (out_r + 5) * Math.sin(d.x0) + ',' + (-(out_r + 5) * Math.cos(d.x0)) + ') ' + 'rotate(' + rotate + ')'); } else { @@ -200,15 +170,13 @@ function renderChart(widget) { return twoArcs; } - var width = widget.dimW, - height = widget.dimH; // The flower had a radius of 640 / 1.9 = 336.84 in the original. - var radius = Math.min(width, height) / 3.2; + var radius = Math.min(widget.dimW, widget.dimH) / 3.2; var sector = twoArcsRender(radius); // Center the graph of 'g' widget.vis = widget.d3vis.append('g') - .attr('transform', 'translate(' + (width / 2) + ',' + height / 2 + ')') + .attr('transform', 'translate(' + (widget.dimW / 2) + ',' + widget.dimH / 2 + ')') .append('g'); var profile = {