victory-scatter 30.6.1 → 31.2.0
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.
- package/README.md +26 -30
- package/dist/victory-scatter.js +1398 -1148
- package/dist/victory-scatter.min.js +1 -1
- package/es/helper-methods.js +2 -1
- package/es/victory-scatter.js +8 -2
- package/lib/helper-methods.js +3 -1
- package/lib/victory-scatter.js +8 -2
- package/package.json +2 -2
- package/src/helper-methods.js +52 -14
- package/src/victory-scatter.js +43 -14
package/README.md
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
|
|
2
1
|
# VictoryScatter
|
|
3
2
|
|
|
4
3
|
`victory-scatter@^30.0.0` exports `VictoryScatter`
|
|
@@ -49,7 +48,7 @@ animate={{
|
|
|
49
48
|
|
|
50
49
|
The `bubbleProperty` prop indicates which property of the data object should be used to scale data points in a bubble chart. If a `bubbleProperty` is given, `size` and `symbol` props will be ignored. Bubble charts always render circular points.
|
|
51
50
|
|
|
52
|
-
|
|
51
|
+
_default:_ `bubbleProperty="z"`
|
|
53
52
|
|
|
54
53
|
```playground
|
|
55
54
|
<VictoryScatter
|
|
@@ -119,7 +118,7 @@ In addition to svg style properties and `label`, `VictoryScatter` will also pref
|
|
|
119
118
|
|
|
120
119
|
See the [Custom Components Guide][] for more detail on creating your own `dataComponents`
|
|
121
120
|
|
|
122
|
-
|
|
121
|
+
_default:_ `<Point/>`
|
|
123
122
|
|
|
124
123
|
```playground_norender
|
|
125
124
|
class CatPoint extends React.Component {
|
|
@@ -177,7 +176,7 @@ domainPadding={{x: [10, -10], y: 5}}
|
|
|
177
176
|
`VictoryScatter` uses the standard `eventKey` prop to specify how event targets are addressed. **This prop is not commonly used.** [Read about the `eventKey` prop in more detail here](https://formidable.com/open-source/victory/docs/common-props#eventkey)
|
|
178
177
|
|
|
179
178
|
```jsx
|
|
180
|
-
eventKey="x"
|
|
179
|
+
eventKey = "x";
|
|
181
180
|
```
|
|
182
181
|
|
|
183
182
|
### events
|
|
@@ -234,7 +233,7 @@ See the [Events Guide][] for more information on defining events.
|
|
|
234
233
|
|
|
235
234
|
`VictoryScatter` uses the standard `groupComponent` prop. [Read about it in detail here](https://formidable.com/open-source/victory/docs/common-props#groupcomponent)
|
|
236
235
|
|
|
237
|
-
|
|
236
|
+
_default:_ `<g/>`
|
|
238
237
|
|
|
239
238
|
```playground
|
|
240
239
|
<VictoryChart>
|
|
@@ -252,7 +251,7 @@ See the [Events Guide][] for more information on defining events.
|
|
|
252
251
|
|
|
253
252
|
`VictoryScatter` uses the standard `height` prop. [Read about it in detail here](https://formidable.com/open-source/victory/docs/common-props#height)
|
|
254
253
|
|
|
255
|
-
|
|
254
|
+
_default (provided by default theme):_ `height={300}`
|
|
256
255
|
|
|
257
256
|
```jsx
|
|
258
257
|
height={400}
|
|
@@ -264,7 +263,7 @@ height={400}
|
|
|
264
263
|
|
|
265
264
|
`VictoryScatter` uses the standard `labelComponent` prop. [Read about it in detail here](https://formidable.com/open-source/victory/docs/common-props#labelcomponent)
|
|
266
265
|
|
|
267
|
-
|
|
266
|
+
_default:_ `<VictoryLabel/>`
|
|
268
267
|
|
|
269
268
|
```playground
|
|
270
269
|
<VictoryScatter
|
|
@@ -300,13 +299,13 @@ For more information on bubble charts, see [`bubbleProperty`][]
|
|
|
300
299
|
```jsx
|
|
301
300
|
maxBubbleSize={25}
|
|
302
301
|
```
|
|
302
|
+
|
|
303
303
|
### maxDomain
|
|
304
304
|
|
|
305
305
|
`type: number || { x: number, y: number }`
|
|
306
306
|
|
|
307
307
|
`VictoryScatter` uses the standard `maxDomain` prop. [Read about it in detail](https://formidable.com/open-source/victory/docs/common-props#maxDomain)
|
|
308
308
|
|
|
309
|
-
|
|
310
309
|
```playground
|
|
311
310
|
<VictoryChart maxDomain={8}>
|
|
312
311
|
<VictoryScatter data={sampleData}/>
|
|
@@ -331,7 +330,6 @@ minBubbleSize={5}
|
|
|
331
330
|
|
|
332
331
|
`VictoryScatter` uses the standard `minDomain` prop. [Read about it in detail](https://formidable.com/open-source/victory/docs/common-props#minDomain)
|
|
333
332
|
|
|
334
|
-
|
|
335
333
|
```playground
|
|
336
334
|
<VictoryChart minDomain={0}>
|
|
337
335
|
<VictoryScatter data={sampleData}/>
|
|
@@ -345,7 +343,7 @@ minBubbleSize={5}
|
|
|
345
343
|
The `name` prop is used to reference a component instance when defining shared events.
|
|
346
344
|
|
|
347
345
|
```jsx
|
|
348
|
-
name="series-1"
|
|
346
|
+
name = "series-1";
|
|
349
347
|
```
|
|
350
348
|
|
|
351
349
|
### origin
|
|
@@ -362,7 +360,7 @@ name="series-1"
|
|
|
362
360
|
|
|
363
361
|
`VictoryScatter` uses the standard `padding` prop. [Read about it in detail here](https://formidable.com/open-source/victory/docs/common-props#padding)
|
|
364
362
|
|
|
365
|
-
|
|
363
|
+
_default (provided by default theme):_ `padding={50}`
|
|
366
364
|
|
|
367
365
|
```jsx
|
|
368
366
|
padding={{ top: 20, bottom: 60 }}
|
|
@@ -408,7 +406,7 @@ padding={{ top: 20, bottom: 60 }}
|
|
|
408
406
|
|
|
409
407
|
`VictoryScatter` uses the standard `samples` prop to generate data when plotting functions. [Read about it in more detail here](https://formidable.com/open-source/victory/docs/common-props#samples)
|
|
410
408
|
|
|
411
|
-
|
|
409
|
+
_default:_ `samples={50}`
|
|
412
410
|
|
|
413
411
|
```jsx
|
|
414
412
|
samples={100}
|
|
@@ -421,7 +419,7 @@ samples={100}
|
|
|
421
419
|
`VictoryScatter` uses the standard `scale` prop. [Read about it here](https://formidable.com/open-source/victory/docs/common-props#scale)
|
|
422
420
|
Options for scale include "linear", "time", "log", "sqrt" and the `d3-scale` functions that correspond to these options.
|
|
423
421
|
|
|
424
|
-
|
|
422
|
+
_default:_ `scale="linear"`
|
|
425
423
|
|
|
426
424
|
```jsx
|
|
427
425
|
scale={{x: "linear", y: "log"}}
|
|
@@ -457,7 +455,7 @@ The `size` prop determines how to scale each data point. This prop may also be g
|
|
|
457
455
|
`VictoryScatter` uses the standard `sortKey` prop to determine how data should be ordered. [Read about it in more detail here](https://formidable.com/open-source/victory/docs/common-props#sortkey)
|
|
458
456
|
|
|
459
457
|
```jsx
|
|
460
|
-
sortKey="x"
|
|
458
|
+
sortKey = "x";
|
|
461
459
|
```
|
|
462
460
|
|
|
463
461
|
### sortOrder
|
|
@@ -466,7 +464,7 @@ sortKey="x"
|
|
|
466
464
|
|
|
467
465
|
The `sortOrder` prop specifies whether sorted data should be returned in ascending or descending order.
|
|
468
466
|
|
|
469
|
-
|
|
467
|
+
_default:_ `sortOrder="ascending"`
|
|
470
468
|
|
|
471
469
|
### standalone
|
|
472
470
|
|
|
@@ -476,7 +474,7 @@ The `sortOrder` prop specifies whether sorted data should be returned in ascendi
|
|
|
476
474
|
|
|
477
475
|
**note:** When `VictoryScatter` is nested within a component like `VictoryChart`, this prop will be set to `false`
|
|
478
476
|
|
|
479
|
-
|
|
477
|
+
_default:_ `standalone={true}`
|
|
480
478
|
|
|
481
479
|
```playground
|
|
482
480
|
<svg width={300} height={300}>
|
|
@@ -490,14 +488,13 @@ The `sortOrder` prop specifies whether sorted data should be returned in ascendi
|
|
|
490
488
|
</svg>
|
|
491
489
|
```
|
|
492
490
|
|
|
493
|
-
|
|
494
491
|
### style
|
|
495
492
|
|
|
496
493
|
`type: { parent: object, data: object, labels: object }`
|
|
497
494
|
|
|
498
495
|
`VictoryScatter` uses the standard `style` prop. [Read about it in detail here](https://formidable.com/open-source/victory/docs/common-props#style)
|
|
499
496
|
|
|
500
|
-
|
|
497
|
+
_default (provided by default theme):_ See [grayscale theme][] for more detail
|
|
501
498
|
|
|
502
499
|
```playground
|
|
503
500
|
<VictoryScatter
|
|
@@ -525,7 +522,7 @@ The `sortOrder` prop specifies whether sorted data should be returned in ascendi
|
|
|
525
522
|
|
|
526
523
|
The `symbol` prop determines which symbol should be drawn to represent data points. Options are: "circle", "diamond", "plus", "square", "star", "triangleDown", "triangleUp". This prop may also be given as a function of data. If no `symbol` prop is specified, a circle will be rendered. `symbol` may also be set directly on each data object.
|
|
527
524
|
|
|
528
|
-
|
|
525
|
+
_default:_ `symbol="circle"`
|
|
529
526
|
|
|
530
527
|
```playground
|
|
531
528
|
<VictoryScatter
|
|
@@ -543,7 +540,7 @@ The `symbol` prop determines which symbol should be drawn to represent data poin
|
|
|
543
540
|
|
|
544
541
|
See the [Themes Guide][] for information about creating custom themes.
|
|
545
542
|
|
|
546
|
-
|
|
543
|
+
_default:_ `theme={VictoryTheme.grayscale}`
|
|
547
544
|
|
|
548
545
|
```jsx
|
|
549
546
|
theme={VictoryTheme.material}
|
|
@@ -555,7 +552,7 @@ theme={VictoryTheme.material}
|
|
|
555
552
|
|
|
556
553
|
`VictoryScatter` uses the standard `width` prop. [Read about it in detail here](https://formidable.com/open-source/victory/docs/common-props#width)
|
|
557
554
|
|
|
558
|
-
|
|
555
|
+
_default (provided by default theme):_ `width={450}`
|
|
559
556
|
|
|
560
557
|
```jsx
|
|
561
558
|
width={400}
|
|
@@ -570,14 +567,13 @@ width={400}
|
|
|
570
567
|
See the [Data Accessors Guide][] for more detail on formatting and processing data.
|
|
571
568
|
|
|
572
569
|
```jsx
|
|
573
|
-
x="employee.name"
|
|
570
|
+
x = "employee.name";
|
|
574
571
|
```
|
|
575
572
|
|
|
576
573
|
### y
|
|
577
574
|
|
|
578
575
|
`type: string || integer || array[string] || function`
|
|
579
576
|
|
|
580
|
-
|
|
581
577
|
`VictoryScatter` uses the standard `y` data accessor prop. [Read about it in detail here](https://formidable.com/open-source/victory/docs/common-props#y)
|
|
582
578
|
|
|
583
579
|
See the [Data Accessors Guide][] for more detail on formatting and processing data.
|
|
@@ -592,11 +588,11 @@ y={(d) => d.value + d.error}
|
|
|
592
588
|
|
|
593
589
|
**It is not common to set a `y0` prop with `VictoryScatter`, as baselines for `VictoryScatter` are only relevant for stacked charts.** [Read more about the `y0` prop here](https://formidable.com/open-source/victory/docs/common-props#y0)
|
|
594
590
|
|
|
595
|
-
[
|
|
596
|
-
[`
|
|
597
|
-
[
|
|
598
|
-
[
|
|
599
|
-
[
|
|
600
|
-
[
|
|
601
|
-
[`
|
|
591
|
+
[animations guide]: https://formidable.com/open-source/victory/guides/animations
|
|
592
|
+
[`bubbleproperty`]: https://formidable.com/open-source/victory/docs/victory-scatter#bubbleproperty
|
|
593
|
+
[data accessors guide]: https://formidable.com/open-source/victory/guides/data-accessors
|
|
594
|
+
[custom components guide]: https://formidable.com/open-source/victory/guides/custom-components
|
|
595
|
+
[events guide]: https://formidable.com/open-source/victory/guides/events
|
|
596
|
+
[themes guide]: https://formidable.com/open-source/victory/guides/themes
|
|
597
|
+
[`victorychart`]: https://formidable.com/open-source/victory/docs/victory-chart
|
|
602
598
|
[grayscale theme]: https://github.com/FormidableLabs/victory-core/blob/master/src/victory-theme/grayscale.js
|