Skip to content

Commit 34094ed

Browse files
committed
Update docs with new width/height 'auto' option
1 parent 4405590 commit 34094ed

1 file changed

Lines changed: 13 additions & 8 deletions

File tree

README.md

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -339,8 +339,8 @@ can be read and written via [`scatterplot.get()`](#scatterplot.get) and [`scatte
339339
| regl | object | `createRegl(canvas)` | | `false` | `false` |
340340
| syncEvents | boolean | `false` | | `false` | `false` |
341341
| version | string | | | `false` | `false` |
342-
| width | integer | `300` | > 0 | `true` | `false` |
343-
| height | integer | `200` | > 0 | `true` | `false` |
342+
| width | int or str | `'auto'` | `'auto'` or > 0 | `true` | `false` |
343+
| height | int or str | `'auto'` | `'auto'` or > 0 | `true` | `false` |
344344
| aspectRatio | float | `1.0` | > 0 | `true` | `false` |
345345
| backgroundColor | string or array | rgba(0, 0, 0, 1) | hex, rgb, rgba | `true` | `false` |
346346
| backgroundImage | function | `null` | Regl texture | `true` | `true` |
@@ -358,9 +358,9 @@ can be read and written via [`scatterplot.get()`](#scatterplot.get) and [`scatte
358358
| pointColor | quadruple | `[0.66, 0.66, 0.66, 1]` | single value or list of hex, rgb, rgba | `true` | `false` |
359359
| pointColorActive | quadruple | `[0, 0.55, 1, 1]` | single value or list of hex, rgb, rgba | `true` | `false` |
360360
| pointColorHover | quadruple | `[1, 1, 1, 1]` | single value or list of hex, rgb, rgba | `true` | `false` |
361-
| pointOutlineWidth | integer | `2` | >= 0 | `true` | `false` |
362-
| pointSize | integer | `6` | > 0 | `true` | `false` |
363-
| pointSizeSelected | integer | `2` | >= 0 | `true` | `false` |
361+
| pointOutlineWidth | int | `2` | >= 0 | `true` | `false` |
362+
| pointSize | int | `6` | > 0 | `true` | `false` |
363+
| pointSizeSelected | int | `2` | >= 0 | `true` | `false` |
364364
| showPointConnection | boolean | `false` | | `true` | `false` |
365365
| pointConnectionColor | quadruple | `[0.66, 0.66, 0.66, 0.2]` | | `true` | `false` |
366366
| pointConnectionColorActive | quadruple | `[0, 0.55, 1, 1]` | | `true` | `false` |
@@ -372,11 +372,11 @@ can be read and written via [`scatterplot.get()`](#scatterplot.get) and [`scatte
372372
| pointConnectionSize | float | `2` | | `true` | `false` |
373373
| pointConnectionSizeActive | float | `2` | | `true` | `false` |
374374
| pointConnectionSizeBy | string | `null` | See [data encoding](#property-point-conntection-by) | `true` | `false` |
375-
| pointConnectionMaxIntPointsPerSegment | integer | `100` | | `true` | `false` |
375+
| pointConnectionMaxIntPointsPerSegment | int | `100` | | `true` | `false` |
376376
| pointConnectionTolerance | float | `0.002` | | `true` | `false` |
377377
| lassoColor | quadruple | rgba(0, 0.667, 1, 1) | hex, rgb, rgba | `true` | `false` |
378-
| lassoMinDelay | integer | 15 | >= 0 | `true` | `false` |
379-
| lassoMinDist | integer | 4 | >= 0 | `true` | `false` |
378+
| lassoMinDelay | int | 15 | >= 0 | `true` | `false` |
379+
| lassoMinDist | int | 4 | >= 0 | `true` | `false` |
380380
| lassoClearEvent | string | `'lassoEnd'` | `'lassoEnd'` or `'deselect'` | `true` | `false` |
381381
| lassoInitiator | boolean | `false` | | `true` | `false` |
382382
| lassoInitiatorElement | object | the lasso dom element | | `false` | `false` |
@@ -396,6 +396,11 @@ can be read and written via [`scatterplot.get()`](#scatterplot.get) and [`scatte
396396
value. For example, if you call `scatterplot.attr({ width: 0 });` the width
397397
will not be changed as `0` is interpreted as a falsy value.
398398

399+
- By default, the `width` and `height` are set to `'auto'`, which will make the
400+
`canvas` stretch all the way to the bounds of its clostest parent element with
401+
`position: relative`. When set to `'auto'` the library also takes care of
402+
resizing the canvas on `resize` and `orientationchange` events.
403+
399404
- The background of the scatterplot is transparent, i.e., you have to control
400405
the background with CSS! `background` is used when drawing the
401406
outline of selected points to simulate the padded border only.

0 commit comments

Comments
 (0)