8000 Merge pull request #31 from plotly/autosize · cpbotha/react-plotly.js@de220b9 · GitHub
[go: up one dir, main page]
Skip to content

Commit de220b9

Browse files
nicolaskruchtennicolaskruchten
authored
Merge pull request plotly#31 from plotly/autosize
Autosize handling
2 parents 16644d7 + cbe8540 commit de220b9

File tree

5 files changed

+938
-21
lines changed

5 files changed

+938
-21
lines changed

‎.babelrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"presets": ["react", "es2015"],
3+
}

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ npm-debug.log*
88
!.gitattributes
99
!.npmignore
1010
!.eslintrc
11+
!.babelrc
1112
!.eslintignore
1213

1314
dist

‎README.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ If you build your project using webpack, you'll have to follow [these instructio
102102
import Plot from 'react-plotly.js'
103103

104104
render () {
105-
return <Plot
105+
return <Plot
106106
data={...}
107107
layout={...}
108108
frames={...}
@@ -119,7 +119,7 @@ In this case, we want to use `react-plotly.js` without building `plotly.js` and
119119
2. Declare `Plotly` as a global in [App.js](https://github.com/plotly/react-plotly.js-demo-app/blob/master/src/App.js#L1)
120120
3. Use `createPlotlyComponent()` in [App.js](https://github.com/plotly/react-plotly.js-demo-app/blob/master/src/App.js#L25)
121121

122-
This lets us skip the [specific build configuration](#build-with-webpack) necessary to build `plotly.js` in webpack environments (`create-react-app` uses webpack under the hood).
122+
This lets us skip the [specific build configuration](#build-with-webpack) necessary to build `plotly.js` in webpack environments (`create-react-app` uses webpack under the hood).
123123

124124
### With external plotly.js
125125

@@ -143,7 +143,7 @@ you may then inject Plotly and use the returned React component:
143143
import createPlotlyComponent from 'react-plotly.js/factory'
144144

145145
/* (Note that Plotly is already defined from loading plotly.js through a <script> tag) */
146-
const Plot = createPlotlyComponent(Plotly);
146+
const Plot = createPlotlyComponent(Plotly);
147147

148148
render () {
149149
return <Plot
@@ -191,7 +191,9 @@ You can see an example of this method in action [here](https://codepen.io/rsreus
191191
| `data` | `Array` | `[]` | list of trace objects |
192192
| `layout` | `Object` | `undefined` | layout object |
193193
| `config` | `Object` | `undefined` | config object |
194+
| `style` | `Object` | `{position: 'relative', display: 'inline-block'}` | used to style the containing `<div>` |
194195
| `frames` | `Array` | `undefined` | list of frame objects |
196+
| `useResizeHandler` | `Boolean` | `false` | When true, adds a call to `Plotly.Plot.resize()` as a `window.resize` event handler |
195197
| `fit` | `Boolean` | `false` | When true, disregards `layout.width` and `layout.height` and fits to the parent div size, updating on `window.resize` |
196198
| `revision` | `Number` | `undefined` | When provided, causes the plot to update *only* when the revision is incremented. |
197199
| `debug` | `Boolean` | `false` | Assign the graph div to `window.gd` for debugging |

0 commit comments

Comments
 (0)
0