nagi1 /
hill-chart
| Total Complexity | 112 |
| Complexity/F | 1.62 |
| Lines of Code | 536 |
| Function Count | 69 |
| Duplicated Lines | 536 |
| Ratio | 100 % |
| Changes | 0 | ||
Duplicate code is one of the most pungent code smells. A rule that is often used is to re-structure code once it is duplicated in three or more places.
Common duplication problems, and corresponding solutions are:
Complex classes like demo/hill-chart.nod3.umd.min.js often do a lot of different things. To break such a class down, we need to identify a cohesive component within that class. A common approach to find such a component is to look for fields/methods that share the same prefixes, or suffixes.
Once you have determined the fields that belong together, you can apply the Extract Class refactoring. If the component makes sense as a sub-class, Extract Subclass is also a candidate, and is often faster.
| 1 | !(function (t, e) { |
||
| 2 | 'object' == typeof exports && 'undefined' != typeof module |
||
| 3 | ? (module.exports = e( |
||
| 4 | require('d3-selection'), |
||
| 5 | require('d3-scale'), |
||
| 6 | require('d3-axis'), |
||
| 7 | require('d3-shape'), |
||
| 8 | require('d3-drag'), |
||
| 9 | require('d3-array') |
||
| 10 | )) |
||
| 11 | : 'function' == typeof define && define.amd |
||
| 12 | ? define([ |
||
| 13 | 'd3-selection', |
||
| 14 | 'd3-scale', |
||
| 15 | 'd3-axis', |
||
| 16 | 'd3-shape', |
||
| 17 | 'd3-drag', |
||
| 18 | 'd3-array', |
||
| 19 | ], e) |
||
| 20 | : ((t = t || self).HillChart = e(t.d3, t.d3, t.d3, t.d3, t.d3, t.d3)); |
||
| 21 | })(this, function (t, e, n, r, i, a) { |
||
| 22 | 'use strict'; |
||
| 23 | function o(t, e) { |
||
| 24 | for (var n = 0; n < e.length; n++) { |
||
| 25 | var r = e[n]; |
||
| 26 | (r.enumerable = r.enumerable || !1), |
||
| 27 | (r.configurable = !0), |
||
| 28 | 'value' in r && (r.writable = !0), |
||
| 29 | Object.defineProperty(t, r.key, r); |
||
| 30 | } |
||
| 31 | } |
||
| 32 | function c(t, e, n) { |
||
| 33 | return ( |
||
| 34 | e in t |
||
| 35 | ? Object.defineProperty(t, e, { |
||
| 36 | value: n, |
||
| 37 | enumerable: !0, |
||
| 38 | configurable: !0, |
||
| 39 | writable: !0, |
||
| 40 | }) |
||
| 41 | : (t[e] = n), |
||
| 42 | t |
||
| 43 | ); |
||
| 44 | } |
||
| 45 | function s(t, e) { |
||
| 46 | var n = Object.keys(t); |
||
| 47 | if (Object.getOwnPropertySymbols) { |
||
| 48 | var r = Object.getOwnPropertySymbols(t); |
||
| 49 | e && |
||
| 50 | (r = r.filter(function (e) { |
||
| 51 | return Object.getOwnPropertyDescriptor(t, e).enumerable; |
||
| 52 | })), |
||
| 53 | n.push.apply(n, r); |
||
| 54 | } |
||
| 55 | return n; |
||
| 56 | } |
||
| 57 | function l(t) { |
||
| 58 | for (var e = 1; e < arguments.length; e++) { |
||
| 59 | var n = null != arguments[e] ? arguments[e] : {}; |
||
| 60 | e % 2 |
||
| 61 | ? s(Object(n), !0).forEach(function (e) { |
||
| 62 | c(t, e, n[e]); |
||
| 63 | }) |
||
| 64 | : Object.getOwnPropertyDescriptors |
||
| 65 | ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(n)) |
||
| 66 | : s(Object(n)).forEach(function (e) { |
||
| 67 | Object.defineProperty(t, e, Object.getOwnPropertyDescriptor(n, e)); |
||
| 68 | }); |
||
| 69 | } |
||
| 70 | return t; |
||
| 71 | } |
||
| 72 | function u(t) { |
||
| 73 | return (u = Object.setPrototypeOf |
||
| 74 | ? Object.getPrototypeOf |
||
| 75 | : function (t) { |
||
| 76 | return t.__proto__ || Object.getPrototypeOf(t); |
||
| 77 | })(t); |
||
| 78 | } |
||
| 79 | function h(t, e) { |
||
| 80 | return (h = |
||
| 81 | Object.setPrototypeOf || |
||
| 82 | function (t, e) { |
||
| 83 | return (t.__proto__ = e), t; |
||
| 84 | })(t, e); |
||
| 85 | } |
||
| 86 | function f(t) { |
||
| 87 | if (void 0 === t) |
||
| 88 | throw new ReferenceError( |
||
| 89 | "this hasn't been initialised - super() hasn't been called" |
||
| 90 | ); |
||
| 91 | return t; |
||
| 92 | } |
||
| 93 | function p(t, e) { |
||
| 94 | return !e || ('object' != typeof e && 'function' != typeof e) ? f(t) : e; |
||
| 95 | } |
||
| 96 | function d(t) { |
||
| 97 | var e = (function () { |
||
| 98 | if ('undefined' == typeof Reflect || !Reflect.construct) return !1; |
||
| 99 | if (Reflect.construct.sham) return !1; |
||
| 100 | if ('function' == typeof Proxy) return !0; |
||
| 101 | try { |
||
| 102 | return ( |
||
| 103 | Date.prototype.toString.call( |
||
| 104 | Reflect.construct(Date, [], function () {}) |
||
| 105 | ), |
||
| 106 | !0 |
||
| 107 | ); |
||
| 108 | } catch (t) { |
||
| 109 | return !1; |
||
| 110 | } |
||
| 111 | })(); |
||
| 112 | return function () { |
||
| 113 | var n, |
||
| 114 | r = u(t); |
||
| 115 | if (e) { |
||
| 116 | var i = u(this).constructor; |
||
| 117 | n = Reflect.construct(r, arguments, i); |
||
| 118 | } else n = r.apply(this, arguments); |
||
| 119 | return p(this, n); |
||
| 120 | }; |
||
| 121 | } |
||
| 122 | var y = (function () { |
||
| 123 | function t(t, e) { |
||
| 124 | for (var n = 0; n < e.length; n++) { |
||
| 125 | var r = e[n]; |
||
| 126 | (r.enumerable = r.enumerable || !1), |
||
| 127 | (r.configurable = !0), |
||
| 128 | 'value' in r && (r.writable = !0), |
||
| 129 | Object.defineProperty(t, r.key, r); |
||
| 130 | } |
||
| 131 | } |
||
| 132 | return function (e, n, r) { |
||
| 133 | return n && t(e.prototype, n), r && t(e, r), e; |
||
| 134 | }; |
||
| 135 | })(); |
||
| 136 | function v(t, e) { |
||
| 137 | if (!(t instanceof e)) |
||
| 138 | throw new TypeError('Cannot call a class as a function'); |
||
| 139 | } |
||
| 140 | var g = { emitDelay: 10, strictMode: !1 }, |
||
| 141 | m = (function () { |
||
| 142 | function t() { |
||
| 143 | var e = |
||
| 144 | arguments.length <= 0 || void 0 === arguments[0] ? g : arguments[0]; |
||
| 145 | v(this, t); |
||
| 146 | var n = void 0, |
||
| 147 | r = void 0; |
||
| 148 | (n = e.hasOwnProperty('emitDelay') ? e.emitDelay : g.emitDelay), |
||
| 149 | (this._emitDelay = n), |
||
| 150 | (r = e.hasOwnProperty('strictMode') ? e.strictMode : g.strictMode), |
||
| 151 | (this._strictMode = r), |
||
| 152 | (this._listeners = {}), |
||
| 153 | (this.events = []); |
||
| 154 | } |
||
| 155 | return ( |
||
| 156 | y(t, [ |
||
| 157 | { |
||
| 158 | key: '_addListenner', |
||
| 159 | value: function (t, e, n) { |
||
| 160 | if ('function' != typeof e) |
||
| 161 | throw TypeError('listener must be a function'); |
||
| 162 | -1 === this.events.indexOf(t) |
||
| 163 | ? ((this._listeners[t] = [{ once: n, fn: e }]), |
||
| 164 | this.events.push(t)) |
||
| 165 | : this._listeners[t].push({ once: n, fn: e }); |
||
| 166 | }, |
||
| 167 | }, |
||
| 168 | { |
||
| 169 | key: 'on', |
||
| 170 | value: function (t, e) { |
||
| 171 | this._addListenner(t, e, !1); |
||
| 172 | }, |
||
| 173 | }, |
||
| 174 | { |
||
| 175 | key: 'once', |
||
| 176 | value: function (t, e) { |
||
| 177 | this._addListenner(t, e, !0); |
||
| 178 | }, |
||
| 179 | }, |
||
| 180 | { |
||
| 181 | key: 'off', |
||
| 182 | value: function (t, e) { |
||
| 183 | var n, |
||
| 184 | r, |
||
| 185 | i = this, |
||
| 186 | a = this.events.indexOf(t); |
||
| 187 | t && |
||
| 188 | -1 !== a && |
||
| 189 | (e |
||
| 190 | ? ((n = []), |
||
| 191 | (r = i._listeners[t]).forEach(function (t, r) { |
||
| 192 | t.fn === e && n.unshift(r); |
||
| 193 | }), |
||
| 194 | n.forEach(function (t) { |
||
| 195 | r.splice(t, 1); |
||
| 196 | }), |
||
| 197 | r.length || (i.events.splice(a, 1), delete i._listeners[t])) |
||
| 198 | : (delete this._listeners[t], this.events.splice(a, 1))); |
||
| 199 | }, |
||
| 200 | }, |
||
| 201 | { |
||
| 202 | key: '_applyEvents', |
||
| 203 | value: function (t, e) { |
||
| 204 | var n = this._listeners[t]; |
||
| 205 | if (n && n.length) { |
||
| 206 | var r = []; |
||
| 207 | n.forEach(function (t, n) { |
||
| 208 | t.fn.apply(null, e), t.once && r.unshift(n); |
||
| 209 | }), |
||
| 210 | r.forEach(function (t) { |
||
| 211 | n.splice(t, 1); |
||
| 212 | }); |
||
| 213 | } else if (this._strictMode) |
||
| 214 | throw 'No listeners specified for event: ' + t; |
||
| 215 | }, |
||
| 216 | }, |
||
| 217 | { |
||
| 218 | key: 'emit', |
||
| 219 | value: function (t) { |
||
| 220 | for ( |
||
| 221 | var e = this, |
||
| 222 | n = arguments.length, |
||
| 223 | r = Array(n > 1 ? n - 1 : 0), |
||
| 224 | i = 1; |
||
| 225 | i < n; |
||
| 226 | i++ |
||
| 227 | ) |
||
| 228 | r[i - 1] = arguments[i]; |
||
| 229 | this._emitDelay |
||
| 230 | ? setTimeout(function () { |
||
| 231 | e._applyEvents.call(e, t, r); |
||
| 232 | }, this._emitDelay) |
||
| 233 | : this._applyEvents(t, r); |
||
| 234 | }, |
||
| 235 | }, |
||
| 236 | { |
||
| 237 | key: 'emitSync', |
||
| 238 | value: function (t) { |
||
| 239 | for ( |
||
| 240 | var e = arguments.length, n = Array(e > 1 ? e - 1 : 0), r = 1; |
||
| 241 | r < e; |
||
| 242 | r++ |
||
| 243 | ) |
||
| 244 | n[r - 1] = arguments[r]; |
||
| 245 | this._applyEvents(t, n); |
||
| 246 | }, |
||
| 247 | }, |
||
| 248 | { |
||
| 249 | key: 'destroy', |
||
| 250 | value: function () { |
||
| 251 | (this._listeners = {}), (this.events = []); |
||
| 252 | }, |
||
| 253 | }, |
||
| 254 | ]), |
||
| 255 | t |
||
| 256 | ); |
||
| 257 | })(), |
||
| 258 | x = function (t) { |
||
| 259 | return 50 * Math.sin((Math.PI / 50) * t - 0.5 * Math.PI) + 50; |
||
| 260 | }, |
||
| 261 | b = function (t) { |
||
| 262 | return t >= 80 && t <= 100; |
||
| 263 | }, |
||
| 264 | O = function (t, e) { |
||
| 265 | var n = t + 5; |
||
| 266 | return b(e) ? -1 * n : n; |
||
| 267 | }, |
||
| 268 | k = { |
||
| 269 | target: 'svg', |
||
| 270 | width: 900, |
||
| 271 | height: 300, |
||
| 272 | preview: !1, |
||
| 273 | margin: { top: 20, right: 20, bottom: 40, left: 20 }, |
||
| 274 | }; |
||
| 275 | return (function (c) { |
||
| 276 | !(function (t, e) { |
||
| 277 | if ('function' != typeof e && null !== e) |
||
| 278 | throw new TypeError( |
||
| 279 | 'Super expression must either be null or a function' |
||
| 280 | ); |
||
| 281 | (t.prototype = Object.create(e && e.prototype, { |
||
| 282 | constructor: { value: t, writable: !0, configurable: !0 }, |
||
| 283 | })), |
||
| 284 | e && h(t, e); |
||
| 285 | })(v, c); |
||
| 286 | var s, |
||
| 287 | u, |
||
| 288 | p, |
||
| 289 | y = d(v); |
||
| 290 | function v(t, e) { |
||
| 291 | var n; |
||
| 292 | return ( |
||
| 293 | (function (t, e) { |
||
| 294 | if (!(t instanceof e)) |
||
| 295 | throw new TypeError('Cannot call a class as a function'); |
||
| 296 | })(this, v), |
||
| 297 | (n = y.call(this)), |
||
| 298 | Object.assign(f(n), k, { data: t }, e), |
||
| 299 | n.init(), |
||
| 300 | n |
||
| 301 | ); |
||
| 302 | } |
||
| 303 | return ( |
||
| 304 | (s = v), |
||
| 305 | (u = [ |
||
| 306 | { |
||
| 307 | key: 'init', |
||
| 308 | value: function () { |
||
| 309 | var n = this.width, |
||
| 310 | r = this.height, |
||
| 311 | i = this.margin, |
||
| 312 | a = this.target; |
||
| 313 | (this.chartWidth = n - i.left - i.right), |
||
| 314 | (this.chartHeight = r - i.top - i.bottom), |
||
| 315 | (this.svg = t |
||
| 316 | .select(a) |
||
| 317 | .attr('width', n) |
||
| 318 | .attr('height', r) |
||
| 319 | .append('g') |
||
| 320 | .attr( |
||
| 321 | 'transform', |
||
| 322 | 'translate('.concat(i.left, ', ').concat(i.top, ')') |
||
| 323 | )), |
||
| 324 | (this.xScale = e |
||
| 325 | .scaleLinear() |
||
| 326 | .domain([0, 100]) |
||
| 327 | .range([0, this.chartWidth])), |
||
| 328 | (this.yScale = e |
||
| 329 | .scaleLinear() |
||
| 330 | .domain([0, 100]) |
||
| 331 | .range([this.chartHeight, 0])), |
||
| 332 | this.normalizeData(); |
||
| 333 | }, |
||
| 334 | }, |
||
| 335 | { |
||
| 336 | key: 'normalizeData', |
||
| 337 | value: function () { |
||
| 338 | this.data = this.data.map(function (t) { |
||
| 339 | return { |
||
| 340 | color: t.color, |
||
| 341 | description: t.description, |
||
| 342 | link: t.link, |
||
| 343 | x: t.x, |
||
| 344 | y: x(t.y), |
||
| 345 | size: t.size ? t.size : 10, |
||
| 346 | }; |
||
| 347 | }); |
||
| 348 | }, |
||
| 349 | }, |
||
| 350 | { |
||
| 351 | key: 'render', |
||
| 352 | value: function () { |
||
| 353 | var e = this; |
||
| 354 | this.renderBottomLine(5), |
||
| 355 | this.renderMainCurve(), |
||
| 356 | this.renderMiddleLine(), |
||
| 357 | this.renderFooterText(); |
||
| 358 | var n, |
||
| 359 | r = this, |
||
| 360 | a = i.drag().on('drag', function (e) { |
||
| 361 | var n, |
||
| 362 | i = t.event.x; |
||
| 363 | if ( |
||
| 364 | (i < 0 |
||
| 365 | ? (r.emit('home', e), (i = 0)) |
||
| 366 | : i > r.chartWidth && |
||
| 367 | ((i = r.chartWidth), r.emit('end', e)), |
||
| 368 | !r.preview) |
||
| 369 | ) { |
||
| 370 | var a = r.xScale.invert(i); |
||
| 371 | (e.x = i), (e.y = r.yScale(x(a))); |
||
| 372 | var o = |
||
| 373 | ((n = r.yScale.invert(e.y)), |
||
| 374 | (25 * (2 * Math.asin((n - 50) / 50) + Math.PI)) / |
||
| 375 | Math.PI), |
||
| 376 | c = { x: a, y: o }, |
||
| 377 | s = t |
||
| 378 | .select(this) |
||
| 379 | .attr( |
||
| 380 | 'transform', |
||
| 381 | 'translate('.concat(e.x, ', ').concat(e.y, ')') |
||
| 382 | ); |
||
| 383 | s |
||
| 384 | .select('text') |
||
| 385 | .style('text-anchor', function () { |
||
| 386 | return b(a) ? 'end' : 'start'; |
||
| 387 | }) |
||
| 388 | .attr('x', function (t) { |
||
| 389 | return O(t.size, a); |
||
| 390 | }), |
||
| 391 | s.on('click', function () { |
||
| 392 | r.emit('PointClick', e); |
||
| 393 | }), |
||
| 394 | r.emit('move', a, o), |
||
| 395 | r.emit('moved', l(l({}, e), c)); |
||
| 396 | } |
||
| 397 | }); |
||
| 398 | (n = this.preview |
||
| 399 | ? this.undraggablePoint() |
||
| 400 | : this.svg |
||
| 401 | .selectAll('.hill-chart-group') |
||
| 402 | .data(this.data) |
||
| 403 | .enter() |
||
| 404 | .append('g') |
||
| 405 | .attr('class', 'hill-chart-group') |
||
| 406 | .attr('transform', function (t) { |
||
| 407 | return ( |
||
| 408 | (t.x = e.xScale(t.x)), |
||
| 409 | (t.y = e.yScale(t.y)), |
||
| 410 | 'translate('.concat(t.x, ', ').concat(t.y, ')') |
||
| 411 | ); |
||
| 412 | }) |
||
| 413 | .call(a)) |
||
| 414 | .append('circle') |
||
| 415 | .attr('class', 'hill-chart-circle') |
||
| 416 | .attr('fill', function (t) { |
||
| 417 | return t.color; |
||
| 418 | }) |
||
| 419 | .attr('cx', 0) |
||
| 420 | .attr('cy', 0) |
||
| 421 | .attr('r', function (t) { |
||
| 422 | return t.size; |
||
| 423 | }), |
||
| 424 | n |
||
| 425 | .append('text') |
||
| 426 | .text(function (t) { |
||
| 427 | return t.description; |
||
| 428 | }) |
||
| 429 | .attr('x', function (t) { |
||
| 430 | return O(t.size, e.xScale.invert(t.x)); |
||
| 431 | }) |
||
| 432 | .style('text-anchor', function (t) { |
||
| 433 | return b(e.xScale.invert(t.x)) ? 'end' : 'start'; |
||
| 434 | }) |
||
| 435 | .attr('y', 5); |
||
| 436 | }, |
||
| 437 | }, |
||
| 438 | { |
||
| 439 | key: 'undraggablePoint', |
||
| 440 | value: function () { |
||
| 441 | var t = this; |
||
| 442 | return this.svg |
||
| 443 | .selectAll('.hill-chart-group') |
||
| 444 | .data(this.data) |
||
| 445 | .enter() |
||
| 446 | .append('a') |
||
| 447 | .attr('href', function (t) { |
||
| 448 | return t.link ? t.link : '#'; |
||
| 449 | }) |
||
| 450 | .append('g') |
||
| 451 | .attr('class', 'hill-chart-group') |
||
| 452 | .style('cursor', 'pointer') |
||
| 453 | .attr('transform', function (e) { |
||
| 454 | return ( |
||
| 455 | (e.x = t.xScale(e.x)), |
||
| 456 | (e.y = t.yScale(e.y)), |
||
| 457 | 'translate('.concat(e.x, ', ').concat(e.y, ')') |
||
| 458 | ); |
||
| 459 | }); |
||
| 460 | }, |
||
| 461 | }, |
||
| 462 | { |
||
| 463 | key: 'renderMainCurve', |
||
| 464 | value: function () { |
||
| 465 | var t = this; |
||
| 466 | (this.mainLineCurvePoints = a.range(0, 100, 0.1).map(function (t) { |
||
| 467 | return { x: t, y: x(t) }; |
||
| 468 | })), |
||
| 469 | (this.line = r |
||
| 470 | .line() |
||
| 471 | .x(function (e) { |
||
| 472 | return t.xScale(e.x); |
||
| 473 | }) |
||
| 474 | .y(function (e) { |
||
| 475 | return t.yScale(e.y); |
||
| 476 | })), |
||
| 477 | this.svg |
||
| 478 | .append('path') |
||
| 479 | .attr('class', 'chart-hill-main-curve') |
||
| 480 | .datum(this.mainLineCurvePoints) |
||
| 481 | .attr('d', this.line); |
||
| 482 | }, |
||
| 483 | }, |
||
| 484 | { |
||
| 485 | key: 'renderBottomLine', |
||
| 486 | value: function () { |
||
| 487 | var t = |
||
| 488 | arguments.length > 0 && void 0 !== arguments[0] |
||
| 489 | ? arguments[0] |
||
| 490 | : 5; |
||
| 491 | (this.bottomLine = n.axisBottom(this.xScale).ticks(0).tickSize(0)), |
||
| 492 | this.svg |
||
| 493 | .append('g') |
||
| 494 | .attr('class', 'hill-chart-bottom-line') |
||
| 495 | .attr( |
||
| 496 | 'transform', |
||
| 497 | 'translate(0, '.concat(this.chartHeight + t, ')') |
||
| 498 | ) |
||
| 499 | .call(this.bottomLine); |
||
| 500 | }, |
||
| 501 | }, |
||
| 502 | { |
||
| 503 | key: 'renderMiddleLine', |
||
| 504 | value: function () { |
||
| 505 | this.svg |
||
| 506 | .append('line') |
||
| 507 | .attr('class', 'hill-chart-middle-line') |
||
| 508 | .attr('y1', this.yScale(0)) |
||
| 509 | .attr('y2', this.yScale(100)) |
||
| 510 | .attr('x2', this.xScale(50)) |
||
| 511 | .attr('x1', this.xScale(50)); |
||
| 512 | }, |
||
| 513 | }, |
||
| 514 | { |
||
| 515 | key: 'renderFooterText', |
||
| 516 | value: function () { |
||
| 517 | this.svg |
||
| 518 | .append('text') |
||
| 519 | .attr('class', 'hill-chart-text') |
||
| 520 | .text('Figuring things out') |
||
| 521 | .attr('x', this.xScale(25)) |
||
| 522 | .attr('y', this.chartHeight + 25), |
||
| 523 | this.svg |
||
| 524 | .append('text') |
||
| 525 | .attr('class', 'hill-chart-text') |
||
| 526 | .text('Making it happen') |
||
| 527 | .attr('x', this.xScale(75)) |
||
| 528 | .attr('y', this.chartHeight + 25); |
||
| 529 | }, |
||
| 530 | }, |
||
| 531 | ]) && o(s.prototype, u), |
||
| 532 | p && o(s, p), |
||
| 533 | v |
||
| 534 | ); |
||
| 535 | })(m); |
||
| 536 | }); |
||
| 537 |
