@plotdb/chart 1.0.1 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (164) hide show
  1. package/package.json +3 -1
  2. package/CHANGELOG.md +0 -29
  3. package/build +0 -45
  4. package/doc/charts.md +0 -58
  5. package/doc/config.md +0 -44
  6. package/doc/draft/chart.md +0 -146
  7. package/doc/draft/data.md +0 -8
  8. package/doc/draft/definition.md +0 -0
  9. package/doc/draft/events.md +0 -0
  10. package/doc/draft/filter.md +0 -0
  11. package/doc/draft/lifecycle.md +0 -89
  12. package/doc/spec.md +0 -89
  13. package/doc/todo.md +0 -27
  14. package/doc/utils/tip.md +0 -84
  15. package/src/data/en-US/category +0 -20
  16. package/src/data/en-US/fruit +0 -39
  17. package/src/data/en-US/movie +0 -125
  18. package/src/data/en-US/name +0 -58
  19. package/src/data/index.ls +0 -34
  20. package/src/data/zh-TW/category +0 -20
  21. package/src/data/zh-TW/fruits +0 -38
  22. package/src/data/zh-TW/movie +0 -125
  23. package/src/data/zh-TW/names +0 -105
  24. package/src/index.ls +0 -323
  25. package/src/index.styl +0 -6
  26. package/src/utils/axis.ls +0 -229
  27. package/src/utils/config.ls +0 -11
  28. package/src/utils/data.ls +0 -104
  29. package/src/utils/format.ls +0 -30
  30. package/src/utils/legend.ls +0 -134
  31. package/src/utils/legend.styl +0 -37
  32. package/src/utils/tint.ls +0 -66
  33. package/src/utils/tip.ls +0 -97
  34. package/web/src/pug/base.pug +0 -21
  35. package/web/src/pug/block/axis/0.0.1/index.ls +0 -32
  36. package/web/src/pug/block/axis/0.0.1/index.pug +0 -1
  37. package/web/src/pug/block/axis-bubble/0.0.1/index.ls +0 -137
  38. package/web/src/pug/block/axis-bubble/0.0.1/index.pug +0 -1
  39. package/web/src/pug/block/bar/0.0.1/index.ls +0 -270
  40. package/web/src/pug/block/bar/0.0.1/index.pug +0 -35
  41. package/web/src/pug/block/bar-list/0.0.1/index.ls +0 -81
  42. package/web/src/pug/block/bar-list/0.0.1/index.pug +0 -30
  43. package/web/src/pug/block/bar-race/0.0.1/index.ls +0 -79
  44. package/web/src/pug/block/bar-race/0.0.1/index.pug +0 -21
  45. package/web/src/pug/block/base/0.0.1/index.ls +0 -66
  46. package/web/src/pug/block/base/0.0.1/index.pug +0 -5
  47. package/web/src/pug/block/blank/0.0.1/index.ls +0 -21
  48. package/web/src/pug/block/blank/0.0.1/index.pug +0 -1
  49. package/web/src/pug/block/bubble/0.0.1/index.ls +0 -218
  50. package/web/src/pug/block/bubble/0.0.1/index.pug +0 -42
  51. package/web/src/pug/block/curve-bar/0.0.1/index.ls +0 -85
  52. package/web/src/pug/block/curve-bar/0.0.1/index.pug +0 -16
  53. package/web/src/pug/block/curve-bar/0.0.1/sample.js +0 -338
  54. package/web/src/pug/block/dumbbell/0.0.1/index.ls +0 -86
  55. package/web/src/pug/block/dumbbell/0.0.1/index.pug +0 -1
  56. package/web/src/pug/block/empty/0.0.1/index.ls +0 -28
  57. package/web/src/pug/block/empty/0.0.1/index.pug +0 -2
  58. package/web/src/pug/block/gauge/0.0.1/index.ls +0 -96
  59. package/web/src/pug/block/gauge/0.0.1/index.pug +0 -31
  60. package/web/src/pug/block/gauge/0.0.1/sample.js +0 -338
  61. package/web/src/pug/block/line/0.0.1/index.ls +0 -297
  62. package/web/src/pug/block/line/0.0.1/index.pug +0 -33
  63. package/web/src/pug/block/number/0.0.1/index.ls +0 -65
  64. package/web/src/pug/block/number/0.0.1/index.pug +0 -20
  65. package/web/src/pug/block/percent-list/0.0.1/index.ls +0 -161
  66. package/web/src/pug/block/percent-list/0.0.1/index.pug +0 -34
  67. package/web/src/pug/block/pie/0.0.1/index.ls +0 -121
  68. package/web/src/pug/block/pie/0.0.1/index.pug +0 -19
  69. package/web/src/pug/block/pie/0.0.1/sample.js +0 -338
  70. package/web/src/pug/block/pie-bubble/0.0.1/index.ls +0 -181
  71. package/web/src/pug/block/pie-bubble/0.0.1/index.pug +0 -40
  72. package/web/src/pug/block/radar/0.0.1/index.ls +0 -109
  73. package/web/src/pug/block/radar/0.0.1/index.pug +0 -1
  74. package/web/src/pug/block/radar/0.0.1/xx +0 -285
  75. package/web/src/pug/block/scatter/0.0.1/index.ls +0 -124
  76. package/web/src/pug/block/scatter/0.0.1/index.pug +0 -30
  77. package/web/src/pug/block/sheet/0.0.1/index.ls +0 -34
  78. package/web/src/pug/block/sheet/0.0.1/index.pug +0 -5
  79. package/web/src/pug/block/table/0.0.1/index.ls +0 -36
  80. package/web/src/pug/block/table/0.0.1/index.pug +0 -3
  81. package/web/src/pug/block/taiwancounty/0.0.1/index.ls +0 -70
  82. package/web/src/pug/block/taiwancounty/0.0.1/index.pug +0 -64
  83. package/web/src/pug/block/taiwantown/0.0.1/index.ls +0 -44
  84. package/web/src/pug/block/taiwantown/0.0.1/index.pug +0 -52
  85. package/web/src/pug/block/taiwanvillage/0.0.1/index.ls +0 -49
  86. package/web/src/pug/block/taiwanvillage/0.0.1/index.pug +0 -52
  87. package/web/src/pug/block/treemap/0.0.1/index.ls +0 -168
  88. package/web/src/pug/block/treemap/0.0.1/index.pug +0 -42
  89. package/web/src/pug/block/voronoi-treemap/0.0.1/index.ls +0 -170
  90. package/web/src/pug/block/voronoi-treemap/0.0.1/index.pug +0 -17
  91. package/web/src/pug/block/voronoi-treemap/0.0.1/sample.js +0 -241
  92. package/web/src/pug/block/wordcloud/0.0.1/index.ls +0 -57
  93. package/web/src/pug/block/wordcloud/0.0.1/index.pug +0 -1
  94. package/web/src/pug/block/worldmap/0.0.1/index.ls +0 -77
  95. package/web/src/pug/block/worldmap/0.0.1/index.pug +0 -12
  96. package/web/src/pug/index.ls +0 -72
  97. package/web/src/pug/index.pug +0 -51
  98. package/web/src/styl/index.styl +0 -6
  99. package/web/static/assets/block/cache.js +0 -4
  100. package/web/static/assets/custom-lib/d3/d3-array.v2.js +0 -1182
  101. package/web/static/assets/custom-lib/d3/d3-array.v2.min.js +0 -2
  102. package/web/static/assets/custom-lib/d3/d3-array.v3.js +0 -1273
  103. package/web/static/assets/custom-lib/d3/d3-array.v3.min.js +0 -1273
  104. package/web/static/assets/custom-lib/d3/d3-axis.v2.min.js +0 -2
  105. package/web/static/assets/custom-lib/d3/d3-brush.v2.min.js +0 -2
  106. package/web/static/assets/custom-lib/d3/d3-color.v2.min.js +0 -2
  107. package/web/static/assets/custom-lib/d3/d3-dispatch.v2.min.js +0 -2
  108. package/web/static/assets/custom-lib/d3/d3-drag.v2.min.js +0 -2
  109. package/web/static/assets/custom-lib/d3/d3-ease.v2.min.js +0 -2
  110. package/web/static/assets/custom-lib/d3/d3-force-boundary.v0.0.1.min.js +0 -2
  111. package/web/static/assets/custom-lib/d3/d3-force.v2.min.js +0 -2
  112. package/web/static/assets/custom-lib/d3/d3-format.v2.min.js +0 -2
  113. package/web/static/assets/custom-lib/d3/d3-geo.v2.js +0 -3127
  114. package/web/static/assets/custom-lib/d3/d3-geo.v2.min.js +0 -2
  115. package/web/static/assets/custom-lib/d3/d3-hierarchy.v2.min.js +0 -2
  116. package/web/static/assets/custom-lib/d3/d3-interpolate.v2.min.js +0 -2
  117. package/web/static/assets/custom-lib/d3/d3-path.v2.min.js +0 -2
  118. package/web/static/assets/custom-lib/d3/d3-quadtree.v2.min.js +0 -2
  119. package/web/static/assets/custom-lib/d3/d3-random.v2.min.js +0 -2
  120. package/web/static/assets/custom-lib/d3/d3-scale-chromatic.v1.min.js +0 -2
  121. package/web/static/assets/custom-lib/d3/d3-selection.v2.min.js +0 -2
  122. package/web/static/assets/custom-lib/d3/d3-shape.v2.min.js +0 -2
  123. package/web/static/assets/custom-lib/d3/d3-timer.v2.min.js +0 -2
  124. package/web/static/assets/custom-lib/d3/d3-transition.v2.min.js +0 -2
  125. package/web/static/assets/custom-lib/d3/d3.v4.js +0 -17178
  126. package/web/static/assets/custom-lib/d3/d3.v4.min.js +0 -2
  127. package/web/static/assets/custom-lib/d3/d3.v6.js +0 -19708
  128. package/web/static/assets/data/countrycode.json +0 -1
  129. package/web/static/assets/data/world-110m.json +0 -1
  130. package/web/static/assets/data/zh-to-alpha2.json +0 -1
  131. package/web/static/assets/img/fluid.svg +0 -16
  132. package/web/static/block/axis/0.0.1/index.html +0 -74
  133. package/web/static/block/axis-bubble/0.0.1/index.html +0 -217
  134. package/web/static/block/bar/0.0.1/index.html +0 -576
  135. package/web/static/block/bar-list/0.0.1/index.html +0 -226
  136. package/web/static/block/bar-race/0.0.1/index.html +0 -179
  137. package/web/static/block/base/0.0.1/index.html +0 -197
  138. package/web/static/block/blank/0.0.1/index.html +0 -37
  139. package/web/static/block/bubble/0.0.1/index.html +0 -422
  140. package/web/static/block/bubble/0.0.1/test.html +0 -0
  141. package/web/static/block/curve-bar/0.0.1/index.html +0 -143
  142. package/web/static/block/dumbbell/0.0.1/index.html +0 -173
  143. package/web/static/block/empty/0.0.1/index.html +0 -76
  144. package/web/static/block/gauge/0.0.1/index.html +0 -145
  145. package/web/static/block/line/0.0.1/index.html +0 -566
  146. package/web/static/block/number/0.0.1/index.html +0 -147
  147. package/web/static/block/percent-list/0.0.1/index.html +0 -311
  148. package/web/static/block/pie/0.0.1/index.html +0 -276
  149. package/web/static/block/pie-bubble/0.0.1/index.html +0 -353
  150. package/web/static/block/radar/0.0.1/index.html +0 -144
  151. package/web/static/block/scatter/0.0.1/index.html +0 -246
  152. package/web/static/block/sheet/0.0.1/index.html +0 -98
  153. package/web/static/block/table/0.0.1/index.html +0 -67
  154. package/web/static/block/taiwancounty/0.0.1/index.html +0 -197
  155. package/web/static/block/taiwantown/0.0.1/index.html +0 -205
  156. package/web/static/block/taiwanvillage/0.0.1/index.html +0 -215
  157. package/web/static/block/treemap/0.0.1/index.html +0 -355
  158. package/web/static/block/voronoi-treemap/0.0.1/index.html +0 -345
  159. package/web/static/block/wordcloud/0.0.1/index.html +0 -87
  160. package/web/static/block/worldmap/0.0.1/index.html +0 -202
  161. package/web/static/css/index.css +0 -6
  162. package/web/static/css/index.min.css +0 -1
  163. package/web/static/favicon.ico +0 -0
  164. package/web/static/index.html +0 -153
@@ -1,270 +0,0 @@
1
- module.exports =
2
- pkg:
3
- name: 'bar', version: '0.0.1'
4
- extend: {name: "base", version: "0.0.1"}
5
- dependencies: []
6
- i18n:
7
- "zh-TW":
8
- "size": "長度"
9
- init: ({root, context, t, pubsub}) ->
10
- pubsub.fire \init, mod: mod({context, t})
11
-
12
- mod = ({context, t}) ->
13
- {chart,d3,debounce} = context
14
- sample: ->
15
- raw: [0 to 10].map (val) ~>
16
- ret = {name: val}
17
- for i from 1 to 4 => ret["val#i"] = Math.random!
18
- return ret
19
- binding:
20
- size: [1 to 4].map -> {key: "val#it", unit: "amount"}
21
- name: {key: "name"}
22
- config: {} <<< chart.utils.config.preset.default <<<
23
- sort:
24
- enabled: type: \boolean
25
- dir: type: \choice, values: <[asc desc none]>
26
- type: type: \choice, values: <[bar column]>, default: \column
27
- dimension:
28
- size: {type: \R, multiple: true, name: "size"}
29
- name: {type: \NO, name: "name"}
30
- init: ->
31
- @tint = tint = new chart.utils.tint!
32
- [[\multiple, \stack], [\percent, false], [\dancing, true]].map ([k,v]) ~>
33
- if !(@cfg[k]?) => @cfg[k] = v
34
- @svg.addEventListener \click, ~>
35
- if !@cfg.dancing or @cfg.percent => return
36
- @align-idx = ((@align-idx or 0) + 1) % (@binding.size.length + 1)
37
- @resize!
38
- @render!
39
- @brush = d3.brushX!
40
- @g = Object.fromEntries <[view xaxis yaxis legend]>.map ~> [it, d3.select(@layout.get-group it)]
41
- @range = "null"
42
- brush = debounce 150, (e) ~>
43
- if @cfg.{}brush.enabled? and !@cfg.brush.enabled => return
44
- range = e.selection
45
- if (_range = JSON.stringify(range)) == @range => return else @range = _range
46
- if !range => @filter {name: undefined}, true
47
- else
48
- domain = @scale.x.domain!
49
- bandwidth = @scale.x.bandwidth!
50
- range = range.map -> Math.floor(it / bandwidth) >? 0 <? (domain.length - 1)
51
- range = [range.0 to range.1].map -> domain[it]
52
- @filter {name: {type: 'index', value: range}}, true
53
- @brush.on \end, brush
54
- @brush.on \brush, brush
55
- @scale = scale = {}
56
- @yaxis = new chart.utils.axis layout: @layout, name: \yaxis, direction: \left
57
- @xaxis = new chart.utils.axis layout: @layout, name: \xaxis, direction: \bottom
58
- @legend = new chart.utils.legend do
59
- layout: @layout
60
- name: \legend
61
- root: @root
62
- shape: (d) -> d3.select(@).attr \fill, tint.get d.key
63
- # d3.brush covers the whole svg element. need to support by calculation. TODO
64
- /*
65
- @tip = new chart.utils.tip {
66
- root: @root
67
- accessor: ({evt}) ~>
68
- if !(evt.target and data = d3.select(evt.target).datum!) => return null
69
- v = if isNaN(data.size) => '-' else "#{data.size.toFixed(2)}#{data.unit or ''}"
70
- return {name: "#{data.group or ''} / #{data.name or ''}", value: v}
71
- range: ~> @layout.get-node \view .getBoundingClientRect!
72
- }
73
- */
74
-
75
- destroy: -> if @tip => @tip.destroy!
76
-
77
- filter: (filters, internal = false) ->
78
- @render!
79
- if internal => return
80
- @brush.move @g.view, if filters.name => filters.name.map ~> @scale.x(it) else null
81
- parse: ->
82
- @data.map (d) -> d.size = d.size.map -> if isNaN(it) => 0 else it
83
- @align-idx = undefined
84
- resize: ->
85
- @type = @cfg.type or \column
86
- #@tip.toggle(if @cfg.{}tip.enabled? => @cfg.tip.enabled else true)
87
- @legend.config @cfg.legend
88
- @legend.update!
89
- @layout.update false
90
-
91
- @max-per-group = @binding.size.map (d,i) ~> Math.max.apply(Math, @data.map -> it.size[i])
92
-
93
- # alternative align base. required for dancing stack
94
- if @cfg.align-idx and !@align-idx => @align-idx = @cfg.align-idx
95
- align-idx = (if @cfg.percent => 0 else (@align-idx or 0)) <? @binding.size.length
96
- @base-offset = @data.map (d) -> [0 til align-idx].reduce(((a,b) -> a + d.size[b]),0) or 0
97
- @delta = delta = Math.max.apply(Math, @base-offset)
98
- # stack bar
99
- if @cfg.multiple == \stack
100
- # 100% stack
101
- if @cfg.percent => max = 1
102
- else
103
- max = Math.max.apply(Math,
104
- @data.map (d) ~> [align-idx til d.size.length].reduce(((a,b) -> a + d.size[b]),0)
105
- ) + (delta or 0)
106
- # group bar
107
- else if @cfg.multiple == \group
108
- max = Math.max.apply(Math, @data.map (d) ~> Math.max.apply(Math, d.size))
109
- # split bars
110
- else if @cfg.multiple == \split
111
- max = @max-per-group.reduce(((a,b) -> a + b),0)
112
- @order = @data.map (d,i) -> {key: d._idx, idx: i, name: d.name}
113
- @data.map (d,i) -> d.sum = d.size.reduce(((a,b) -> a + b),0)
114
- if @cfg.{}sort.enabled =>
115
- @order.sort (a,b) ~> (if @cfg.sort.dir == \asc => 1 else -1) * (@data[a.idx].sum - @data[b.idx].sum)
116
- console.log @cfg
117
- if @cfg.palette => @tint.set(@cfg.palette.colors.map -> it.value or it)
118
- # order reversed to make it visually aligned with bar.
119
- @legend.data [{
120
- key: i, text: @binding.size[i].name or @binding.size[i].key
121
- } for i from @binding.size.length - 1 to 0 by -1 ]
122
- @layout.update false
123
-
124
- box = @layout.get-box \view
125
-
126
- if @type == \column =>
127
- @scale <<<
128
- y: d3.scaleLinear!domain([0,max]).range [box.height, 0]
129
- x: d3.scaleBand!domain @order.map(->it.name or it.key) .range [0, box.width]
130
- max-tick = Math.ceil(@layout.get-box \yaxis .height / 40) >? 2
131
- yticks = if @cfg.bump => [1 to ((@parsed.length or 1) >? 1)]
132
- else @scale.y.ticks((@cfg.{}yaxis.tick-count or 4) <? max-tick)
133
- @yaxis.config @cfg.yaxis
134
- v = @binding.size.0 or {}
135
- if @binding.size.length > 1 => @yaxis.caption( if v.unit => "#{v.unit}" else '')
136
- else @yaxis.caption( (v.name or v.key or '') + if v.unit => "(#{v.unit})" else '')
137
- @yaxis.ticks yticks
138
- @yaxis.scale @scale.y
139
- @xaxis.config @cfg.{}xaxis
140
- @xaxis.ticks @data.map -> it.name
141
- @xaxis.scale @scale.x
142
- @xaxis.caption(
143
- (@binding.name.name or @binding.name.key) +
144
- if @binding.name.unit => "(#{@binding.name.unit})" else ''
145
- )
146
- else
147
- @scale <<<
148
- x: d3.scaleLinear!domain([0,max]).range [box.width, 0]
149
- y: d3.scaleBand!domain @order.map(->it.name or it.key) .range [0, box.height]
150
- max-tick = Math.ceil(@layout.get-box \xaxis .width / 80) >? 2
151
- xticks = if @cfg.bump => [1 to ((@parsed.length or 1) >? 1)]
152
- else @scale.x.ticks((@cfg.{}xaxis.tick-count or 4) <? max-tick)
153
- @xaxis.config @cfg.xaxis
154
- v = @binding.size.0 or {}
155
- if @binding.size.length > 1 => @xaxis.caption( if v.unit => "#{v.unit}" else '')
156
- else @xaxis.caption( (v.name or v.key or '') + if v.unit => "(#{v.unit})" else '')
157
- @xaxis.ticks xticks
158
- @xaxis.scale @scale.x
159
- @yaxis.config @cfg.{}yaxis
160
- @yaxis.ticks @data.map -> it.name
161
- @yaxis.scale @scale.y
162
- @yaxis.caption(
163
- (@binding.name.name or @binding.name.key) +
164
- if @binding.name.unit => "(#{@binding.name.unit})" else ''
165
- )
166
-
167
- # xaxis and yaxis affect each other and they all affect view.
168
- # we may need to update them until stable but for now we simply layout twice.
169
- for i from 0 til 2 =>
170
- @layout.update false
171
- box = @layout.get-box('view')
172
- [w,h] = [box.width, box.height]
173
- @tint.set @cfg.palette
174
- r = @cfg.dot-size or 3
175
- @scale.x.range [0, w - r]
176
- @scale.y.range [h, r]
177
- @xaxis.render!
178
- @yaxis.render!
179
-
180
- box = @layout.get-box \view
181
- @brush.extent [[0, 1],[box.width, box.height - 1]]
182
-
183
- render: ->
184
- {binding, scale, range, delta, base-offset, max-per-group, cfg, tint, data, type} = @
185
- @g.view.selectAll \g.bar .data @data
186
- ..exit!remove!
187
- ..enter!append \g .attr \class, \bar
188
- @g.view.selectAll \g.bar
189
- .attr \transform, (d,i) ~>
190
- if @type == \column => "translate(#{scale.x(d.name)},0)"
191
- else "translate(0,#{scale.y(d.name)})"
192
- .each (item,j) ->
193
- [bars,offset] = [[],0]
194
- # alternative align base. required for dancing stack
195
- offset = (delta - base-offset[j])
196
-
197
- # use to tweak output size / offset. 1 = no modification
198
- sum = 1
199
- # and set sum to this for 100% stack bar
200
- if cfg.percent == true => sum = item.size.reduce(((a,b) -> a + b),0) >? 1
201
-
202
- for idx from 0 til item.size.length =>
203
- size = item.size[idx]
204
- key = idx
205
- bars.push {
206
- size: size / sum
207
- offset: offset / sum
208
- key: key
209
- group: item.name
210
- name: binding.size[key].name or binding.size[key].key
211
- unit: binding.size[key].unit or ''
212
- }
213
- # multiple bars
214
- if cfg.multiple == \split => offset += max-per-group[idx]
215
- # stack bar
216
- else if cfg.multiple == \stack => offset += size
217
-
218
-
219
- d3.select @ .selectAll \rect .data(bars, (d,i) -> d.key)
220
- ..exit!remove!
221
- ..enter!append \rect
222
- ..attr(\width, (d,i) -> (scale.x.bandwidth! - 2) >? 1) if type == \column
223
- ..attr(\y, (d,i) -> scale.y(0)) if type == \column
224
- ..attr(\height, (d,i) -> (scale.y.bandwidth! - 2) >? 1) if type != \column
225
- ..attr(\x, (d,i) -> scale.x(0)) if type != \column
226
-
227
- tran = d3.select @ .selectAll \rect
228
- .transition!duration 350
229
- # group bar
230
- .call (sel) ->
231
- if cfg.multiple != \group => return
232
- sel
233
- ..attr(\x, (d,i) -> 1 + i * (scale.x.bandwidth! - 2) / bars.length) if type == \column
234
- ..attr(\width, (d,i) -> (scale.x.bandwidth! - 2) / bars.length) if type == \column
235
- ..attr(\y, (d,i) -> Math.round(Math.min(scale.y(0), scale.y(d.size)))) if type == \column
236
-
237
- ..attr(\y, (d,i) -> 1 + i * (scale.y.bandwidth! - 2) / bars.length) if type != \column
238
- ..attr(\height, (d,i) -> (scale.y.bandwidth! - 2) / bars.length) if type != \column
239
- ..attr(\x, (d,i) -> Math.round(Math.min(scale.x(0), scale.x(d.size)))) if type != \column
240
-
241
- # stack bar
242
- .call (sel) ->
243
- if cfg.multiple != \stack => return
244
- sel
245
- ..attr(\x, 1) if type == \column
246
- ..attr(\width, (d,i) -> scale.x.bandwidth! - 2) if type == \column
247
- ..attr( \y, (d,i) -> Math.round(Math.min(scale.y(d.offset), scale.y(d.offset + d.size)))) if type == \column
248
- ..attr(\y, 1) if type != \column
249
- ..attr(\height, (d,i) -> scale.y.bandwidth! - 2) if type != \column
250
- ..attr( \x, (d,i) -> Math.round(Math.min(scale.x(d.offset), scale.x(d.offset + d.size)))) if type != \column
251
-
252
- if type == \column =>
253
- tran.attr \height, (d,i) -> Math.round(Math.abs(scale.y(0) - scale.y(d.size)))
254
- else
255
- tran.attr \width, (d,i) -> Math.round(Math.abs(scale.x(0) - scale.x(d.size)))
256
- tran
257
- .attr \fill, (d,i) ~> tint.get i, (if cfg.color-variant => ((j/data.length) - 0.5) else 0)
258
- .attr \fill-opacity, (d,i) ~>
259
- if !(binding.name and filter = binding.name.filter) => return 1
260
- if !(range = filter.value) => return 1
261
- if item.name in range => 1 else 0.2
262
-
263
- if !(@cfg.{}brush.enabled? and !@cfg.brush.enabled) => @g.view.call @brush
264
- @g.view.selectAll \rect.selection
265
- .attr \shape-rendering, \auto
266
- @legend.render!
267
- @yaxis.render!
268
- @xaxis.render!
269
-
270
- tick: ->
@@ -1,35 +0,0 @@
1
- div
2
- div(plug="layout")
3
- .pdl-layout
4
- div(data-type="layout")
5
- .pdl-cell(data-name="yaxis") &nbsp;
6
- .pdl-cell(data-name="view")
7
- .pdl-cell
8
- .pdl-cell(data-name="xaxis") &nbsp;
9
- .pdl-cell(data-name="legend") &nbsp;
10
- div(data-type="render")
11
-
12
- style(type="text/css"): :stylus
13
- [data-name=xaxis] { font-size: 0.8em }
14
- [data-name=yaxis] { font-size: 0.8em }
15
- .pdl-layout > div[data-type=layout]
16
- display: grid
17
- grid-template-columns: fit-content(2em) 1fr fit-content(10em)
18
- grid-template-rows: 1fr fit-content(1em)
19
- /* 0.5em for axis label at the boundary */
20
- padding: 0 0.5em
21
- & > .pdl-cell[data-name=legend]
22
- grid-column: 3
23
- grid-row: 1 / span 2
24
- padding-left: 1em
25
-
26
- .pdl-layout.legend-below > div[data-type=layout]
27
- grid-template-columns: 2em 1fr
28
- grid-template-rows: 1fr fit-content(2em) fit-content(3em)
29
- .pdl-cell[data-name=legend]
30
- padding-top: 1em
31
- grid-column: 1 / span 2
32
- grid-row: 3
33
-
34
-
35
- script(type="@plotdb/block"): include:lsc index.ls
@@ -1,81 +0,0 @@
1
- module.exports =
2
- pkg:
3
- name: 'bar-list', version: '0.0.1'
4
- extend: {name: "base", version: "0.0.1"}
5
- dependencies: [
6
- {url: "/assets/lib/ldview/main/index.min.js"}
7
- ]
8
- init: ({root, context, t, pubsub}) ->
9
- pubsub.fire \init, {
10
- mod: mod({root, context, t})
11
- prepare-svg: false
12
- layout: false
13
- data-accessor: -> it._data._raw
14
- }
15
-
16
- mod = ({root, context, t}) ->
17
- {chart,d3,debounce} = context
18
- sample: ->
19
- raw: [0 to 10].map -> {name: it, value: (Math.random! * 100).toFixed(2)}
20
- binding:
21
- size: {key: "value"}
22
- name: {key: "name"}
23
- config: {}
24
- dimension:
25
- size: {type: \R, name: "size"}
26
- name: {type: \NO, name: "name"}
27
- init: ->
28
- @picked = {}
29
- @tint = tint = new chart.utils.tint!
30
- @scale = scale = {}
31
- @extent = {}
32
- get-list = ~>
33
- return [[k,v] for k,v of @picked].filter(-> !it.1).map -> it.0
34
-
35
- @view = new ldview do
36
- root: root
37
- init-render: false
38
- action: click:
39
- select: ({views, node}) ~>
40
- name = node.getAttribute \data-name
41
- if name == \none => @parsed.map ~> @picked[it.name] = false
42
- else @picked = {}
43
- @filter {name: {type: 'exclude', value: get-list!}}, true
44
- views.0.render \data
45
-
46
- handler:
47
- data:
48
- list: ~> @parsed
49
- key: -> it._idx
50
- action: click: ({views, node, data}) ~>
51
- @picked[data.name] = if @picked[data.name]? => !@picked[data.name] else false
52
- views.0.render \data, data._idx
53
- @filter {name: {type: 'exclude', value: get-list!}}, true
54
-
55
- handler: ({node, data}) ~>
56
- nn = node.querySelector('[ld=name]')
57
- nb = node.querySelector('[ld=bar]')
58
- unit = (@binding.{}size.unit or '')
59
- nn.textContent = "#{data.name} / #{data.size}#{unit}"
60
- nb.style <<< width: "#{(@scale.x data.size)}%", background: @tint.get 'size'
61
- node.style.opacity = if @picked[data.name] == false => 0.3 else 1
62
-
63
- filter: (filters, internal = false)->
64
- parse: ->
65
- @parsed = @data.map -> it
66
- names = @parsed.map -> it.name
67
- @parsed ++= [k for k of @picked]
68
- .filter -> !(it in names)
69
- .map ~> {name: it, size: 0}
70
- @parsed.sort (a,b) ~>
71
- pb = !(@picked[b.name]?) or @picked[b.name]
72
- pa = !(@picked[a.name]?) or @picked[a.name]
73
- if pb and !pa => return 1 else if !pb and pa => return -1
74
- if b.size - a.size => return that
75
- return 0
76
- @parsed.map (d,i) -> d._idx = i
77
-
78
- resize: ->
79
- @extent = d3.extent @parsed.map -> it.size
80
- @scale.x = d3.scaleLinear!domain [0, @extent.1] .range [0, 100]
81
- render: -> @view.render!
@@ -1,30 +0,0 @@
1
- div
2
- div(plug="layout")
3
- .pdl-layout
4
- div(data-type="layout")
5
- div(data-type="render")
6
- .d-flex
7
- .flex-grow-1
8
- .data(ld-each="data")
9
- div(ld="name")
10
- div(ld="bar")
11
- div(style="position:sticky;margin-left:1em;margin-right:.25em;" +
12
- "cursor:pointer;white-space:nowrap;top:0;right:0;align-self:flex-start;height:auto;")
13
- div(ld="select",data-name="all") 全選
14
- div(ld="select",data-name="none") 全不選
15
-
16
- style(type="text/css"): :stylus
17
- .data
18
- padding-bottom: 1em
19
- .pdl-layout
20
- overflow-y: scroll
21
- user-select: none
22
- [data-type=render]
23
- overflow-y: visible
24
- height: auto
25
- .data
26
- cursor: pointer
27
- div[ld=bar]
28
- height: .5em
29
- border-radius: 2px
30
- script(type="@plotdb/block"): include:lsc index.ls
@@ -1,79 +0,0 @@
1
- module.exports =
2
- pkg:
3
- name: 'bar-race', version: '0.0.1'
4
- extend: {name: "base", version: "0.0.1"}
5
- dependencies: []
6
- i18n:
7
- "zh-TW":
8
- "height": "高度"
9
- init: ({root, context, t, pubsub}) ->
10
- pubsub.fire \init, mod: mod({context, t})
11
-
12
- mod = ({context, t}) ->
13
- {chart,d3,debounce} = context
14
- sample: ->
15
- raw: [0 to 100].map (val) ~>
16
- [n,o] = [val % 10, Math.floor(val / 10)]
17
- ret = {name: n, value: Math.random!, order: o}
18
- return ret
19
- binding:
20
- order: {key: "order"}
21
- value: {key: "value"}
22
- name: {key: "name"}
23
- config: {}
24
- dimension:
25
- order: {type: \O, name: "order", priority: 1}
26
- value: {type: \R, name: "value", priority: 2}
27
- name: {type: \N, name: "name"}
28
- init: ->
29
- @tint = tint = new chart.utils.tint!
30
- @g =
31
- view: d3.select(@layout.get-group \view)
32
- axis: d3.select(@layout.get-group \axis)
33
- @scale = scale = {}
34
- @axis-bottom = d3.axis-bottom!
35
- @legend = new chart.utils.legend do
36
- layout: @layout
37
- name: \legend
38
- root: @root
39
- shape: (d) -> d3.select(@).attr \fill, tint.get d.key
40
- parse: ->
41
- @data.map (d) -> d.value = d.value.map -> if isNaN(it) => 0 else +it
42
- @names = Array.from(new Set(@data.map -> it.name))
43
- resize: ->
44
- @layout.get-node \legend .style.width = if !(@cfg.{}legend.enabled?) or @cfg.legend.enabled => '' else '0'
45
- @layout.update false
46
-
47
- @max-per-group = @binding.height.map (d,i) ~> Math.max.apply(Math, @data.map -> it.height[i])
48
- @order = @data.map (d,i) -> {key: d._idx, idx: i, name: d.order}
49
- @order.sort (a,b) -> if b.name > a.name => 1 else if b.name < a.name => -1 else 0
50
-
51
- @tint.set @cfg.palette
52
- @legend.data [{ key: i, text: @names[i] } for i from 0 til @names.length]
53
- @layout.update false
54
- max = Math.max @data.map -> it.value
55
-
56
- box = @layout.get-box \view
57
- @scale <<<
58
- y: d3.scaleLinear!domain([0,max]).range [box.width, 0]
59
- x: d3.scaleBand!domain @order.map(->it.name or it.key) .range [0, box.height]
60
- /*
61
- @axis-bottom.scale @scale.x
62
- ..ticks(@cfg.tick-count) if @cfg.tick-count?
63
- ..tickFormat(d3.format(@cfg.tick-format)) if @cfg.tick-format?
64
- ..tickSizeInner @cfg.tick-size-inner if @cfg.tick-size-inner?
65
- ..tickSizeOuter @cfg.tick-size-outer if @cfg.tick-size-outer?
66
- ..tickPadding @cfg.tick-padding if @cfg.tick-padding?
67
- */
68
-
69
- render: ->
70
- {binding, scale, range, delta, cfg, tint, data} = @
71
- @g.view.selectAll \g.bar .data @data
72
- ..exit!remove!
73
- ..enter!append \g .attr \class, \bar
74
- @g.view.selectAll \g.bar
75
- .attr \transform, (d,i) -> "translate(#{scale.x(d.name)},0)"
76
-
77
- @g.axis.call @axis-bottom
78
- .attr \font-size, ''
79
- tick: ->
@@ -1,21 +0,0 @@
1
- div
2
- div(plug="layout")
3
- .pdl-layout
4
- div(data-type="layout")
5
- .pdl-cell(data-name="view")
6
- .pdl-cell(data-name="axis") &nbsp;
7
- .pdl-cell(data-name="legend") &nbsp;
8
- div(data-type="render")
9
-
10
- style(type="text/css"): :stylus
11
- g[data-name=axis] { font-size: 11px }
12
- .pdl-layout > div[data-type=layout]
13
- display: grid
14
- grid-template-columns: 1fr fit-content(10em)
15
- grid-template-rows: 1fr fit-content(1em)
16
- & > .pdl-cell[data-name=legend]
17
- grid-column: 2
18
- grid-row: 1 / span 2
19
- padding-left: 1em
20
-
21
- script(type="@plotdb/block"): include:lsc index.ls
@@ -1,66 +0,0 @@
1
- module.exports =
2
- pkg:
3
- name: 'base', version: '0.0.1'
4
- dependencies: [
5
- {name: "d3", version: "4", async: false}
6
- {name: "d3-selection", version: "2", async: false}
7
- {name: "d3-random", version: "2"}
8
- {name: "d3-dispatch", version: "2", async: false}
9
- {name: "d3-transition", version: "2"}
10
- {name: "d3-format", version: "2"}
11
- {name: "d3-array", version: "2", async: false}
12
- {name: "d3-color", version: "2"}
13
- {name: "d3-path", version: "2"}
14
- {name: "d3-shape", version: "2"}
15
- {name: "d3-interpolate", version: "2", async: false}
16
- {name: "d3-scale-chromatic", version: "1"}
17
- {name: "d3-ease", version: "2"}
18
- {name: "d3-quadtree", version: "2"}
19
- {name: "d3-timer", version: "2"}
20
- {name: "d3-force", version: "2", async: false}
21
- {name: "d3-hierarchy", version: "2"}
22
- {name: "d3-force-boundary", version: "0.0.1"}
23
- {name: "d3-drag", version: "2"}
24
- {name: "d3-brush", version: "2"}
25
- {name: "d3-axis", version: "2"}
26
- {name: "@loadingio/debounce.js", version: "main", path: "debounce.min.js"}
27
- {name: "wrap-svg-text", version: "main", path: "index.min.js", async: false}
28
- {name: "@plotdb/layout", version: "main", path: "index.min.js", async: false}
29
- {name: "@plotdb/layout", version: "main", path: "index.min.css", type: \css}
30
- {name: "ldcolor", version: "main", path: "ldcolor.min.js", async: false}
31
- {name: "@plotdb/chart", version: "main", path: "chart.js", async: false}
32
- {name: "@plotdb/chart", version: "main", path: "chart.min.css", type: \css}
33
- {name: "@plotdb/chart", version: "main", path: "utils/config.js"}
34
- {name: "@plotdb/chart", version: "main", path: "utils/legend.js"}
35
- {name: "@plotdb/chart", version: "main", path: "utils/legend.css", type: \css}
36
- {name: "@plotdb/chart", version: "main", path: "utils/tint.js"}
37
- {name: "@plotdb/chart", version: "main", path: "utils/format.js", async: false}
38
- {name: "@plotdb/chart", version: "main", path: "utils/axis.js"}
39
- {name: "@plotdb/chart", version: "main", path: "utils/tip.js"}
40
- ]
41
- i18n:
42
- "zh-TW":
43
- "x axis": "X軸"
44
- name: "名稱"
45
-
46
- init: ({root, context, pubsub, data}) ->
47
- {d3,chart} = context
48
- pubsub.on \init, (opt = {}) ~>
49
- opt = {
50
- root: root
51
- delay-render: true
52
- auto-select: true
53
- data-accessor: -> d3.select(it).datum!._raw
54
- } <<< opt
55
- original-init = opt.mod.init
56
- opt.mod.init = ->
57
- @random = d3.randomUniform.source(d3.randomLcg(123))(0, 1)
58
- ret = original-init.apply @
59
- return Promise.resolve!
60
- @chart = c = new chart(opt <<< data)
61
- c.init!then -> c
62
- @
63
-
64
- interface: -> @chart
65
-
66
- mod: (root) -> {config: {}, dimension: {}, init: (->), resize: (->), render: (->)}
@@ -1,5 +0,0 @@
1
- .base(style="width:100%;height:100%")
2
- plug(name="layout")
3
- style(type="text/css"): :stylus
4
- *[plug=layout] { fill: currentColor }
5
- script(type="@plotdb/block"): include:lsc index.ls
@@ -1,21 +0,0 @@
1
- module.exports =
2
- pkg:
3
- name: \blank, version: \0.0.1
4
- extend: name: \base, version: \0.0.1
5
- dependencies: []
6
-
7
- init: ({root, context, pubsub}) ->
8
- pubsub.fire \init,
9
- mod: mod {context}
10
- raw: [0 to 100]
11
- binding: {}
12
-
13
- mod = ({context}) ->
14
- {} = context
15
- config: {}
16
- dimension: {}
17
- init: ->
18
- parse: ->
19
- resize: ->
20
- render: ->
21
- tick: ->
@@ -1 +0,0 @@
1
- div(style="width:100%;height:100%"): script(type="@plotdb/block"): include:lsc index.ls