visualifyjs 2.5.3-2.dev → 2.5.3

Sign up to get free protection for your applications and to get access to all the features.
@@ -117,58 +117,10 @@ const Contrast_funnel = {
117
117
  return getOption;`
118
118
  };
119
119
 
120
- const Multiple_funnel = {
121
- code: `const getOption = () => {
122
- return {
123
- type: 'funnel',
124
- data: {
125
- 'Funnel 1': [
126
- { value: 60, name: 'APP' },
127
- { value: 40, name: 'PC' },
128
- { value: 20, name: 'Mobile' },
129
- { value: 80, name: 'Wechat' },
130
- { value: 100, name: 'Mini App' }
131
- ],
132
- 'Funnel 2': [
133
- { value: 60, name: 'APP' },
134
- { value: 40, name: 'PC' },
135
- { value: 20, name: 'Mobile' },
136
- { value: 80, name: 'Wechat' },
137
- { value: 100, name: 'Mini App' }
138
- ],
139
- },
140
- width: ['35%','35%'],
141
- left: ['10%','55%'],
142
- sort: [ 'descending', 'ascending'],
143
- label: [
144
- {
145
- position: 'left',
146
- },
147
- {
148
- position: 'right',
149
- }
150
- ],
151
- tooltip: {
152
- trigger: 'item',
153
- formatter: '{a} <br/>{b} : {c}%'
154
- },
155
- toolbox: {
156
- feature: {
157
- dataView: { readOnly: false },
158
- restore: {},
159
- saveAsImage: {}
160
- }
161
- }
162
- }
163
- };
164
- return getOption;`
165
- };
166
-
167
120
  const ex1 = new $visualify.LiveEditor(Basic_Funnel).mount('#ex1');
168
121
  const ex2 = new $visualify.LiveEditor(Pyramid_Funnel).mount('#ex2');
169
122
  const ex3 = new $visualify.LiveEditor(More_Funnel).mount('#ex3');
170
123
  const ex4 = new $visualify.LiveEditor(Contrast_funnel).mount('#ex4');
171
- const ex5 = new $visualify.LiveEditor(Multiple_funnel).mount('#ex5');
172
124
  </script>
173
125
 
174
126
  # Radar Chart
@@ -1,298 +0,0 @@
1
- <script defers>
2
-
3
- function rangeRandom(min, max, precision) {
4
- return (Math.random() * (max - min) + min).toFixed(precision)
5
- }
6
-
7
- const randomData = []
8
-
9
- for (let i = 0; i < 50; i++) {
10
- randomData.push([
11
- rangeRandom(20, 200, 2), rangeRandom(10, 100, 2)
12
- ])
13
- }
14
-
15
- const Basic_Scatter = {
16
- code:
17
- `const getOption = () => {
18
- return {
19
- type: 'scatter',
20
- data: {
21
- 'random': ${JSON.stringify(randomData)},
22
- },
23
- }
24
- };
25
- return getOption;`
26
- };
27
-
28
- const Grouped_Scatter = {
29
- code: `const getOption = () => {
30
- return {
31
- type: 'scatter',
32
- data: {
33
- 'female': [
34
- [161.2, 51.6], [167.5, 59.0], [159.5, 49.2], [157.0, 63.0], [155.8, 53.6],
35
- [170.0, 59.0], [159.1, 47.6], [166.0, 69.8], [176.2, 66.8], [160.2, 75.2],
36
- [172.5, 55.2], [170.9, 54.2], [172.9, 62.5], [153.4, 42.0], [160.0, 50.0],
37
- [147.2, 49.8], [168.2, 49.2], [175.0, 73.2], [157.0, 47.8], [167.6, 68.8],
38
- [159.5, 50.6], [175.0, 82.5], [166.8, 57.2], [176.5, 87.8], [170.2, 72.8],
39
- [174.0, 54.5], [173.0, 59.8], [179.9, 67.3], [170.5, 67.8], [160.0, 47.0],
40
- [154.4, 46.2], [162.0, 55.0], [176.5, 83.0], [160.0, 54.4], [152.0, 45.8],
41
- [162.1, 53.6], [170.0, 73.2], [160.2, 52.1], [161.3, 67.9], [166.4, 56.6],
42
- [168.9, 62.3], [163.8, 58.5], [167.6, 54.5], [160.0, 50.2], [161.3, 60.3],
43
- [167.6, 58.3], [165.1, 56.2], [160.0, 50.2], [170.0, 72.9], [157.5, 59.8],
44
- [167.6, 61.0], [160.7, 69.1], [163.2, 55.9], [152.4, 46.5], [157.5, 54.3],
45
- [168.3, 54.8], [180.3, 60.7], [165.5, 60.0], [165.0, 62.0], [164.5, 60.3],
46
- [156.0, 52.7], [160.0, 74.3], [163.0, 62.0], [165.7, 73.1], [161.0, 80.0],
47
- [162.0, 54.7], [166.0, 53.2], [174.0, 75.7], [172.7, 61.1], [167.6, 55.7],
48
- [151.1, 48.7], [164.5, 52.3], [163.5, 50.0], [152.0, 59.3], [169.0, 62.5],
49
- [164.0, 55.7], [161.2, 54.8], [155.0, 45.9], [170.0, 70.6], [176.2, 67.2],
50
- [170.0, 69.4], [162.5, 58.2], [170.3, 64.8], [164.1, 71.6], [169.5, 52.8],
51
- [163.2, 59.8], [154.5, 49.0], [159.8, 50.0], [173.2, 69.2], [170.0, 55.9],
52
- [161.4, 63.4], [169.0, 58.2], [166.2, 58.6], [159.4, 45.7], [162.5, 52.2],
53
- [159.0, 48.6], [162.8, 57.8], [159.0, 55.6], [179.8, 66.8], [162.9, 59.4],
54
- [161.0, 53.6], [151.1, 73.2], [168.2, 53.4], [168.9, 69.0], [173.2, 58.4],
55
- [171.8, 56.2], [178.0, 70.6], [164.3, 59.8], [163.0, 72.0], [168.5, 65.2],
56
- [166.8, 56.6], [172.7, 105.2], [163.5, 51.8], [169.4, 63.4], [167.8, 59.0],
57
- [159.5, 47.6], [167.6, 63.0], [161.2, 55.2], [160.0, 45.0], [163.2, 54.0],
58
- [162.2, 50.2], [161.3, 60.2], [149.5, 44.8], [157.5, 58.8], [163.2, 56.4],
59
- [172.7, 62.0], [155.0, 49.2], [156.5, 67.2], [164.0, 53.8], [160.9, 54.4],
60
- [162.8, 58.0], [167.0, 59.8], [160.0, 54.8], [160.0, 43.2], [168.9, 60.5],
61
- [158.2, 46.4], [156.0, 64.4], [160.0, 48.8], [167.1, 62.2], [158.0, 55.5],
62
- [167.6, 57.8], [156.0, 54.6], [162.1, 59.2], [173.4, 52.7], [159.8, 53.2],
63
- [170.5, 64.5], [159.2, 51.8], [157.5, 56.0], [161.3, 63.6], [162.6, 63.2],
64
- [160.0, 59.5], [168.9, 56.8], [165.1, 64.1], [162.6, 50.0], [165.1, 72.3],
65
- [166.4, 55.0], [160.0, 55.9], [152.4, 60.4], [170.2, 69.1], [162.6, 84.5],
66
- [170.2, 55.9], [158.8, 55.5], [172.7, 69.5], [167.6, 76.4], [162.6, 61.4],
67
- [167.6, 65.9], [156.2, 58.6], [175.2, 66.8], [172.1, 56.6], [162.6, 58.6],
68
- [160.0, 55.9], [165.1, 59.1], [182.9, 81.8], [166.4, 70.7], [165.1, 56.8],
69
- [177.8, 60.0], [165.1, 58.2], [175.3, 72.7], [154.9, 54.1], [158.8, 49.1],
70
- [172.7, 75.9], [168.9, 55.0], [161.3, 57.3], [167.6, 55.0], [165.1, 65.5],
71
- [175.3, 65.5], [157.5, 48.6], [163.8, 58.6], [167.6, 63.6], [165.1, 55.2],
72
- [165.1, 62.7], [168.9, 56.6], [162.6, 53.9], [164.5, 63.2], [176.5, 73.6],
73
- [168.9, 62.0], [175.3, 63.6], [159.4, 53.2], [160.0, 53.4], [170.2, 55.0],
74
- [162.6, 70.5], [167.6, 54.5], [162.6, 54.5], [160.7, 55.9], [160.0, 59.0],
75
- [157.5, 63.6], [162.6, 54.5], [152.4, 47.3], [170.2, 67.7], [165.1, 80.9],
76
- [172.7, 70.5], [165.1, 60.9], [170.2, 63.6], [170.2, 54.5], [170.2, 59.1],
77
- [161.3, 70.5], [167.6, 52.7], [167.6, 62.7], [165.1, 86.3], [162.6, 66.4],
78
- [152.4, 67.3], [168.9, 63.0], [170.2, 73.6], [175.2, 62.3], [175.2, 57.7],
79
- [160.0, 55.4], [165.1, 104.1], [174.0, 55.5], [170.2, 77.3], [160.0, 80.5],
80
- [167.6, 64.5], [167.6, 72.3], [167.6, 61.4], [154.9, 58.2], [162.6, 81.8],
81
- [175.3, 63.6], [171.4, 53.4], [157.5, 54.5], [165.1, 53.6], [160.0, 60.0],
82
- [174.0, 73.6], [162.6, 61.4], [174.0, 55.5], [162.6, 63.6], [161.3, 60.9],
83
- [156.2, 60.0], [149.9, 46.8], [169.5, 57.3], [160.0, 64.1], [175.3, 63.6],
84
- [169.5, 67.3], [160.0, 75.5], [172.7, 68.2], [162.6, 61.4], [157.5, 76.8],
85
- [176.5, 71.8], [164.4, 55.5], [160.7, 48.6], [174.0, 66.4], [163.8, 67.3]
86
- ],
87
- "male": [
88
- [174.0, 65.6], [175.3, 71.8], [193.5, 80.7], [186.5, 72.6], [187.2, 78.8],
89
- [181.5, 74.8], [184.0, 86.4], [184.5, 78.4], [175.0, 62.0], [184.0, 81.6],
90
- [180.0, 76.6], [177.8, 83.6], [192.0, 90.0], [176.0, 74.6], [174.0, 71.0],
91
- [184.0, 79.6], [192.7, 93.8], [171.5, 70.0], [173.0, 72.4], [176.0, 85.9],
92
- [176.0, 78.8], [180.5, 77.8], [172.7, 66.2], [176.0, 86.4], [173.5, 81.8],
93
- [178.0, 89.6], [180.3, 82.8], [180.3, 76.4], [164.5, 63.2], [173.0, 60.9],
94
- [183.5, 74.8], [175.5, 70.0], [188.0, 72.4], [189.2, 84.1], [172.8, 69.1],
95
- [170.0, 59.5], [182.0, 67.2], [170.0, 61.3], [177.8, 68.6], [184.2, 80.1],
96
- [186.7, 87.8], [171.4, 84.7], [172.7, 73.4], [175.3, 72.1], [180.3, 82.6],
97
- [182.9, 88.7], [188.0, 84.1], [177.2, 94.1], [172.1, 74.9], [167.0, 59.1],
98
- [169.5, 75.6], [174.0, 86.2], [172.7, 75.3], [182.2, 87.1], [164.1, 55.2],
99
- [163.0, 57.0], [171.5, 61.4], [184.2, 76.8], [174.0, 86.8], [174.0, 72.2],
100
- [177.0, 71.6], [186.0, 84.8], [167.0, 68.2], [171.8, 66.1], [182.0, 72.0],
101
- [167.0, 64.6], [177.8, 74.8], [164.5, 70.0], [192.0, 101.6], [175.5, 63.2],
102
- [171.2, 79.1], [181.6, 78.9], [167.4, 67.7], [181.1, 66.0], [177.0, 68.2],
103
- [174.5, 63.9], [177.5, 72.0], [170.5, 56.8], [182.4, 74.5], [197.1, 90.9],
104
- [180.1, 93.0], [175.5, 80.9], [180.6, 72.7], [184.4, 68.0], [175.5, 70.9],
105
- [180.6, 72.5], [177.0, 72.5], [177.1, 83.4], [181.6, 75.5], [176.5, 73.0],
106
- [175.0, 70.2], [174.0, 73.4], [165.1, 70.5], [177.0, 68.9], [192.0, 102.3],
107
- [176.5, 68.4], [169.4, 65.9], [182.1, 75.7], [179.8, 84.5], [175.3, 87.7],
108
- [184.9, 86.4], [177.3, 73.2], [167.4, 53.9], [178.1, 72.0], [168.9, 55.5],
109
- [157.2, 58.4], [180.3, 83.2], [170.2, 72.7], [177.8, 64.1], [172.7, 72.3],
110
- [165.1, 65.0], [186.7, 86.4], [165.1, 65.0], [174.0, 88.6], [175.3, 84.1],
111
- [185.4, 66.8], [177.8, 75.5], [180.3, 93.2], [180.3, 82.7], [177.8, 58.0],
112
- [177.8, 79.5], [177.8, 78.6], [177.8, 71.8], [177.8, 116.4], [163.8, 72.2],
113
- [188.0, 83.6], [198.1, 85.5], [175.3, 90.9], [166.4, 85.9], [190.5, 89.1],
114
- [166.4, 75.0], [177.8, 77.7], [179.7, 86.4], [172.7, 90.9], [190.5, 73.6],
115
- [185.4, 76.4], [168.9, 69.1], [167.6, 84.5], [175.3, 64.5], [170.2, 69.1],
116
- [190.5, 108.6], [177.8, 86.4], [190.5, 80.9], [177.8, 87.7], [184.2, 94.5],
117
- [176.5, 80.2], [177.8, 72.0], [180.3, 71.4], [171.4, 72.7], [172.7, 84.1],
118
- [172.7, 76.8], [177.8, 63.6], [177.8, 80.9], [182.9, 80.9], [170.2, 85.5],
119
- [167.6, 68.6], [175.3, 67.7], [165.1, 66.4], [185.4, 102.3], [181.6, 70.5],
120
- [172.7, 95.9], [190.5, 84.1], [179.1, 87.3], [175.3, 71.8], [170.2, 65.9],
121
- [193.0, 95.9], [171.4, 91.4], [177.8, 81.8], [177.8, 96.8], [167.6, 69.1],
122
- [167.6, 82.7], [180.3, 75.5], [182.9, 79.5], [176.5, 73.6], [186.7, 91.8],
123
- [188.0, 84.1], [188.0, 85.9], [177.8, 81.8], [174.0, 82.5], [177.8, 80.5],
124
- [171.4, 70.0], [185.4, 81.8], [185.4, 84.1], [188.0, 90.5], [188.0, 91.4],
125
- [182.9, 89.1], [176.5, 85.0], [175.3, 69.1], [175.3, 73.6], [188.0, 80.5],
126
- [188.0, 82.7], [175.3, 86.4], [170.5, 67.7], [179.1, 92.7], [177.8, 93.6],
127
- [175.3, 70.9], [182.9, 75.0], [170.8, 93.2], [188.0, 93.2], [180.3, 77.7],
128
- [177.8, 61.4], [185.4, 94.1], [168.9, 75.0], [185.4, 83.6], [180.3, 85.5],
129
- [174.0, 73.9], [167.6, 66.8], [182.9, 87.3], [160.0, 72.3], [180.3, 88.6],
130
- [167.6, 75.5], [186.7, 101.4], [175.3, 91.1], [175.3, 67.3], [175.9, 77.7],
131
- [175.3, 81.8], [179.1, 75.5], [181.6, 84.5], [177.8, 76.6], [182.9, 85.0],
132
- [177.8, 102.5], [184.2, 77.3], [179.1, 71.8], [176.5, 87.9], [188.0, 94.3],
133
- [174.0, 70.9], [167.6, 64.5], [170.2, 77.3], [167.6, 72.3], [188.0, 87.3],
134
- [174.0, 80.0], [176.5, 82.3], [180.3, 73.6], [167.6, 74.1], [188.0, 85.9],
135
- [180.3, 73.2], [167.6, 76.3], [183.0, 65.9], [183.0, 90.9], [179.1, 89.1],
136
- [170.2, 62.3], [177.8, 82.7], [179.1, 79.1], [190.5, 98.2], [177.8, 84.1],
137
- [180.3, 83.2], [180.3, 83.2]
138
- ]
139
- },
140
- xAxis:{
141
- min: 140,
142
- max: 200,
143
- },
144
- yAxis:{
145
- min: 40,
146
- max: 120,
147
- },
148
- xAxisLabel: 'Height',
149
- yAxisLabel: 'Weight',
150
- xAxisNameGap: 5,
151
- yAxisNameGap: 5,
152
- tooltip: {
153
- axisPointer: {
154
- type: 'cross'
155
- }
156
- }
157
- }
158
- };
159
- return getOption;`
160
- };
161
-
162
- const Quadrant = {
163
- code: `const getOption = () => {
164
- return {
165
- type: 'scatter',
166
- data: {
167
- 'Data':
168
- [{
169
- value: [1, 1],
170
- symbol: 'none',
171
- }, {
172
- value: [0, -1],
173
- symbol: 'none',
174
- },
175
- [0.35, 0.18],
176
- [0.55, 0.77],
177
- [0.88, 0.23],
178
- [0.23, -0.25],
179
- [0.65, -0.66]
180
- ],
181
- },
182
- markArea: {
183
- itemStyle: {
184
- color: '#FFFAFA',
185
- opacity: '0.7'
186
- },
187
- emphasis: {
188
- itemStyle: {
189
- color: '#FFFAFA',
190
- opacity: '0.7'
191
- },
192
- },
193
- data: [
194
- [{
195
- coord: [0.5, 0]
196
- }, {
197
- coord: [1, 1]
198
- }],
199
- [{
200
- coord: [0.5, 0]
201
- }, {
202
- coord: [0, -1]
203
- }]
204
- ]
205
- },
206
- markLine: {
207
- symbol: 'none',
208
- data: [
209
- [{
210
- value: 0.5,
211
- coord: [0.5, -1]
212
- }, {
213
- coord: [0.5, 1]
214
- }]
215
- ]
216
- },
217
- legend: false,
218
- }
219
- };
220
- return getOption;`
221
- };
222
-
223
- const Bubble = {
224
- code: `const getOption = () => {
225
- return {
226
- type: 'scatter',
227
- data: {
228
- 'bubble': ${JSON.stringify(randomData)},
229
- },
230
- itemStyle: {
231
- normal: {
232
- opacity: 0.8
233
- }
234
- },
235
- symbolSize: function(val) {
236
- const [a, b] = val
237
- return Math.abs(a - b) / 2
238
- },
239
- }
240
- };
241
- return getOption;`
242
- };
243
-
244
- const ex1 = new $visualify.LiveEditor(Basic_Scatter).mount('#ex1');
245
- const ex2 = new $visualify.LiveEditor(Grouped_Scatter).mount('#ex2');
246
- const ex3 = new $visualify.LiveEditor(Quadrant).mount('#ex3');
247
- const ex4 = new $visualify.LiveEditor(Bubble).mount('#ex4');
248
- </script>
249
-
250
- # Scatter Chart
251
-
252
- ## Basic Scatter Chart
253
-
254
- <div id="ex1"></div>
255
-
256
- ## Grouped Scatter Chart
257
-
258
- <div id="ex2"></div>
259
-
260
- ## Quadrant Scatter Chart
261
-
262
- <div id="ex3"></div>
263
-
264
- ## Bubble Scatter Chart
265
-
266
- <div id="ex4"></div>
267
-
268
- ## Overall Configuration
269
-
270
- ### Basic Configuration
271
-
272
- The basic configuration includes:
273
-
274
- | Attribute | Type | Description | Choice | Default |
275
- | --------------- | ----------- | ----------------------- | -------------------------- | ------- |
276
- | title | string | The main title | User-defined title | - |
277
- | subtitle | string | A secondary title | User-defined subtitle | - |
278
- | width | string | The width dimension | Any valid CSS width value | - |
279
- | height | string | The height dimension | Any valid CSS height value | 400px |
280
- | legend | bool/object | show or hide legend | False, User-defined legend | {} |
281
- | xAxis | array/false | The xAxis | User-defined xAxis Data | [] |
282
- | yAxis | array/false | The yAxis | User-defined yAxis Data | [] |
283
- | label | object | The label | User-defined label | {} |
284
- | labelLine | object | The labelLine | User-defined labelLine | {} |
285
- | tooltip | object | The tooltip | User-defined tooltip | {} |
286
- | xAxisLineshow | bool | show or hide xAxisLines | True, False | true |
287
- | yAxisLineshow | bool | show or hide yAxisLines | True, False | true |
288
- | xAxisLabelShow | bool | show or hide xAxisLabel | True, False | true |
289
- | yAxisLabelShow | bool | show or hide yAxisLabel | True, False | true |
290
- | xAxisLabelColor | string | The xAxisLabelColor | Any valid CSS color value | - |
291
- | yAxisLabelColor | string | The yAxisLabelColor | Any valid CSS color value | - |
292
-
293
- ### Data Configuration
294
-
295
- | Attribute | Type | Description | Choice | Default |
296
- | --------- | ------------ | ----------- | ----------------- | --------- |
297
- | data | string | The data | User-defined data | {} |
298
- | type | string/array | The type | 'line', 'bar' | undefined |
@@ -6,6 +6,6 @@
6
6
 
7
7
  > A magical data portal generator
8
8
 
9
- [GitHub](https://github.com/visualify)
9
+ [GitHub](https://github.com/usleolihao)
10
10
  [Getting Started](#visualify)
11
11
 
@@ -13,7 +13,6 @@
13
13
  - [Pie Chart](/Rechart/pie.md)
14
14
  - [Radar Chart](/Rechart/radar.md)
15
15
  - [Funnel Chart](/Rechart/funnel.md)
16
- - [Scatter Chart](/Rechart/scatter.md)
17
16
 
18
17
 
19
18
  - Page Mode
@@ -102,7 +102,9 @@ corner of the site.
102
102
 
103
103
  ```js
104
104
  window.$docsify = {
105
- repo: 'https://github.com/visualify',
105
+ repo: 'leolihao/visualify',
106
+ // or
107
+ repo: 'https://github.com/leolihao/visualify/',
106
108
  };
107
109
  ```
108
110
 
package/docs/docs/log.md CHANGED
@@ -1,9 +1 @@
1
- # log
2
-
3
- ## 2.5.3-1(2024-02-24)
4
-
5
- ### Features
6
- 1. Scatter examples added.
7
- 2. xAxis and yAxis now support Object type data.
8
-
9
-
1
+ # log
@@ -8,12 +8,9 @@ Insert the `visualify` script in your `index.html` file.
8
8
  ```html
9
9
  <head>
10
10
  ...
11
- <script src="https://cdn.jsdelivr.net/npm/visualifyjs"></script>
12
-
11
+ <script src="https://visualify.pharmacy.arizona.edu/dist/visualify.js"></script>
13
12
  <!-- or -->
14
- <!-- <script src="https://visualify.pharmacy.arizona.edu/dist/visualify.js"></script -->
15
- <!-- or -->
16
- <!-- script src="https://cdn.jsdelivr.net/gh/visualify/visualify.js@release/dist/visualify.js"></script> -->
13
+ <!-- script src="https://cdn.jsdelivr.net/npm/visualifyjs"></!-- -->
17
14
  </head>
18
15
  ```
19
16
 
@@ -91,11 +88,9 @@ create `index.html`:
91
88
  //...
92
89
  };
93
90
  </script>
94
- <script src="https://cdn.jsdelivr.net/npm/visualifyjs"></script>
95
- <!-- or -->
96
- <!-- <script src="https://visualify.pharmacy.arizona.edu/dist/visualify.js"></script> -->
91
+ <script src="https://visualify.pharmacy.arizona.edu/dist/visualify.js"></script>
97
92
  <!-- or -->
98
- <!-- script src="https://cdn.jsdelivr.net/gh/visualify/visualify.js@release/dist/visualify.js"></script> -->
93
+ <!-- script src="https://cdn.jsdelivr.net/npm/visualifyjs"></!-- -->
99
94
  </body>
100
95
  </html>
101
96
 
@@ -33,7 +33,7 @@ config.corner = {
33
33
  config.auto2top = true;
34
34
 
35
35
  // basePath (String) | Base path of the website. You can set it to another directory or another domain name.
36
- config.basePath = 'docs/';
36
+ config.basePath = 'https://visualify.github.io/visualify.js/docs/';
37
37
 
38
38
  // autoHeader (Boolean) | Default: false | prepend a header to the page before converting it to HTML.
39
39
  config.autoHeader = false;