beyond-rails 0.0.193 → 0.0.198
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/src/js/components/BarChart.js +3 -3
- data/src/js/components/DateMenu.js +24 -5
- data/src/js/components/LineChart.js +21 -3
- data/src/js/decorators/chartCommon.js +8 -1
- data/src/js/index.js +2 -0
- data/src/sass/components/_btn.scss +1 -0
- data/src/sass/components/_date-menu.scss +3 -0
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: d81d5fde8a2f2cc5d3f71a0421fe362d0b1e1b637487fad895d8dd7eaae101ef
|
4
|
+
data.tar.gz: 33db70f6b7e9f6bcc4ef755a55dc4c2bd18d1bd2fe8ced3575ffdf0cd63cca1b
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: fc37bcf05ef5472fb2fdaf49fd098d8dcfb101d310abe16f891252457325ade7eb1a86b467d2a627068742a918296bdd0dd784be21c8d99fe07ab5e223ffe530
|
7
|
+
data.tar.gz: 0beca937c9dff930a4da40be3ef91c298f15152a94ca0fa52a195d66c5f2c100c6f56a33987d1d4b6311abfecfdf6ded1e44bbb07b14677870009870ce889fe4
|
@@ -20,7 +20,7 @@ export default class BarChart {
|
|
20
20
|
this.options = options
|
21
21
|
this.bars = []
|
22
22
|
|
23
|
-
this.height = options.height
|
23
|
+
this.height = options.height
|
24
24
|
this.width = options.width
|
25
25
|
|
26
26
|
this.toYLabel = isDef(options.toYLabel) ? mem(options.toYLabel) : (v => v)
|
@@ -46,7 +46,7 @@ export default class BarChart {
|
|
46
46
|
|
47
47
|
init() {
|
48
48
|
this.setDpr()
|
49
|
-
this.
|
49
|
+
this.setDomSizeIfNeeded()
|
50
50
|
this.setCanvas()
|
51
51
|
this.clear()
|
52
52
|
this.bindMedia()
|
@@ -342,7 +342,7 @@ export default class BarChart {
|
|
342
342
|
refresh() {
|
343
343
|
this.raf(() => {
|
344
344
|
this.clearBarPos()
|
345
|
-
this.
|
345
|
+
this.setDomSizeIfNeeded()
|
346
346
|
this.setCanvasSize(this.canvas)
|
347
347
|
this.setLabelWidths()
|
348
348
|
this.setLabelHeights()
|
@@ -60,7 +60,8 @@ export default class DateMenu {
|
|
60
60
|
}
|
61
61
|
|
62
62
|
useSingleMenu() {
|
63
|
-
|
63
|
+
const { useSingleMenu, isStatic } = this.options
|
64
|
+
return isTouchDevice() || isStatic || useSingleMenu
|
64
65
|
}
|
65
66
|
|
66
67
|
setHoveredCell(data) {
|
@@ -204,7 +205,8 @@ export default class DateMenu {
|
|
204
205
|
|
205
206
|
addMenu() {
|
206
207
|
const dom = document.createElement('div')
|
207
|
-
|
208
|
+
const className = this.options.isStatic ? 'date-menu static' : 'date-menu'
|
209
|
+
dom.className = className
|
208
210
|
|
209
211
|
if (this.useSingleMenu()) {
|
210
212
|
dom.innerHTML = `
|
@@ -257,7 +259,15 @@ export default class DateMenu {
|
|
257
259
|
this.btnPrev = dom.querySelector('[data-btn-prev]')
|
258
260
|
this.btnNext = dom.querySelector('[data-btn-next]')
|
259
261
|
}
|
260
|
-
|
262
|
+
|
263
|
+
const container = this.options.dom
|
264
|
+
|
265
|
+
if (container) {
|
266
|
+
container.appendChild(dom)
|
267
|
+
}
|
268
|
+
else {
|
269
|
+
document.body.appendChild(dom)
|
270
|
+
}
|
261
271
|
this.dom = dom
|
262
272
|
}
|
263
273
|
|
@@ -350,8 +360,17 @@ export default class DateMenu {
|
|
350
360
|
show(src) {
|
351
361
|
const { dom } = this
|
352
362
|
dom.style.opacity = 0
|
353
|
-
|
354
|
-
this.
|
363
|
+
|
364
|
+
if (this.options.isStatic) {
|
365
|
+
dom.style.display = 'inline-block'
|
366
|
+
}
|
367
|
+
else {
|
368
|
+
dom.style.display = 'block'
|
369
|
+
}
|
370
|
+
|
371
|
+
if (src) {
|
372
|
+
this.pos(src)
|
373
|
+
}
|
355
374
|
dom.style.opacity = 1
|
356
375
|
this.isVisible = true
|
357
376
|
}
|
@@ -41,7 +41,7 @@ export default class LineChart {
|
|
41
41
|
this.dom = dom
|
42
42
|
this.options = options
|
43
43
|
this.pointsArr = []
|
44
|
-
this.height = options.height
|
44
|
+
this.height = options.height
|
45
45
|
this.width = options.width
|
46
46
|
|
47
47
|
this.toXLabel = isDef(options.toXLabel) ? mem(options.toXLabel) : (v => v)
|
@@ -76,7 +76,7 @@ export default class LineChart {
|
|
76
76
|
|
77
77
|
init() {
|
78
78
|
this.setDpr()
|
79
|
-
this.
|
79
|
+
this.setDomSizeIfNeeded()
|
80
80
|
this.setCanvas()
|
81
81
|
this.clear()
|
82
82
|
this.bindMedia()
|
@@ -438,12 +438,13 @@ export default class LineChart {
|
|
438
438
|
refresh() {
|
439
439
|
this.raf(() => {
|
440
440
|
this.clearPointPos()
|
441
|
-
this.
|
441
|
+
this.setDomSizeIfNeeded()
|
442
442
|
this.setCanvasSize(this.canvas)
|
443
443
|
this.layers.forEach(layer => this.setCanvasSize(layer.canvas))
|
444
444
|
this.setLabelWidths()
|
445
445
|
this.setLabelHeights()
|
446
446
|
this.setAxisData()
|
447
|
+
this.updateLabelSizeForAutoStep()
|
447
448
|
this.setPointPos()
|
448
449
|
this.draw()
|
449
450
|
})
|
@@ -496,6 +497,7 @@ export default class LineChart {
|
|
496
497
|
this.setLabelWidths()
|
497
498
|
this.setLabelHeights()
|
498
499
|
this.setAxisData()
|
500
|
+
this.updateLabelSizeForAutoStep()
|
499
501
|
this.setPointPos()
|
500
502
|
this.raf(() => this.draw())
|
501
503
|
}
|
@@ -513,6 +515,22 @@ export default class LineChart {
|
|
513
515
|
})
|
514
516
|
}
|
515
517
|
|
518
|
+
updateLabelSizeForAutoStep() {
|
519
|
+
const { measureWidth } = this
|
520
|
+
if (isUndef(this.xStep)) {
|
521
|
+
this.xLabelWidth = this.xLabelRows.reduce((width, row) => {
|
522
|
+
const measuredWidth = row.length
|
523
|
+
return (measuredWidth > width) ? measuredWidth : width
|
524
|
+
}, 0)
|
525
|
+
}
|
526
|
+
if (isUndef(this.yStep)) {
|
527
|
+
this.yLabelWidth = this.yLabelRows.reduce((width, row) => {
|
528
|
+
const measuredWidth = measureWidth.call(this, row.label)
|
529
|
+
return (measuredWidth > width) ? measuredWidth : width
|
530
|
+
}, 0)
|
531
|
+
}
|
532
|
+
}
|
533
|
+
|
516
534
|
destroy() {
|
517
535
|
const { dom, canvas } = this
|
518
536
|
const { toXLabel, toYLabel } = this.options
|
@@ -155,6 +155,10 @@ export default function chartCommon(target) {
|
|
155
155
|
return [stepStart, stepEnd]
|
156
156
|
}
|
157
157
|
|
158
|
+
measureWidth(value) {
|
159
|
+
return this.ctx.measureText(value).width
|
160
|
+
}
|
161
|
+
|
158
162
|
raf(fn) {
|
159
163
|
if (isDef(window.requestAnimationFrame)) {
|
160
164
|
return window.requestAnimationFrame(fn)
|
@@ -201,10 +205,13 @@ export default function chartCommon(target) {
|
|
201
205
|
canvas.getContext('2d').scale(dpr, dpr)
|
202
206
|
}
|
203
207
|
|
204
|
-
|
208
|
+
setDomSizeIfNeeded() {
|
205
209
|
if (isUndef(this.options.width)) {
|
206
210
|
this.width = this.dom.offsetWidth
|
207
211
|
}
|
212
|
+
if (isUndef(this.options.height)) {
|
213
|
+
this.height = this.dom.offsetHeight
|
214
|
+
}
|
208
215
|
}
|
209
216
|
|
210
217
|
setDpr() {
|
data/src/js/index.js
CHANGED
@@ -9,6 +9,7 @@ import Autocomplete from './components/Autocomplete'
|
|
9
9
|
import BarChart from './components/BarChart'
|
10
10
|
import Btn from './components/Btn'
|
11
11
|
import Checkbox from './components/Checkbox'
|
12
|
+
import DateMenu from './components/DateMenu'
|
12
13
|
import DateTimeRanger from './components/DateTimeRanger'
|
13
14
|
import Datepicker from './components/Datepicker'
|
14
15
|
import Dropdown from './components/Dropdown'
|
@@ -33,6 +34,7 @@ export {
|
|
33
34
|
BarChart,
|
34
35
|
Btn,
|
35
36
|
Checkbox,
|
37
|
+
DateMenu,
|
36
38
|
DateTimeRanger,
|
37
39
|
Datepicker,
|
38
40
|
Dropdown,
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: beyond-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.198
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- kmsheng
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2020-09-
|
12
|
+
date: 2020-09-18 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: sassc
|