Skip to content

CHANGELOG + animations docs #634

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Dec 12, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
62 changes: 60 additions & 2 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
- Please note that these configuration options are for offline plots ONLY. For configuration options when embedding online plots please see our [embed tutorial](http://help.plot.ly/embed-graphs-in-websites/#step-8-customize-the-iframe).
- `colors.py` file which contains functions for manipulating and validating colors and arrays of colors
- 'scale' param in `FF.create_trisurf` which now can set the interpolation on the colorscales
- animations now work in offline mode. By running `plotly.offline.plot()` and `plotly.offline.iplot()` with a `fig` with `frames`, the resulting plot will cycle through the figures defined in `frames` either in the browser or in an ipython notebook respectively. Here's an example
- animations now work in offline mode. By running `plotly.offline.plot()` and `plotly.offline.iplot()` with a `fig` with `frames`, the resulting plot will cycle through the figures defined in `frames` either in the browser or in an ipython notebook respectively. Here's an example:
```
import IPython.display
from IPython.display import display, HTML
Expand All @@ -46,7 +46,65 @@ figure_or_data = {'data': [{'x': [1, 2], 'y': [0, 1]}],
iplot(figure_or_data)
```
More examples can be found at https://plot.ly/python/animations/.
- Upcoming animations in online mode: use `plotly.plotly.create_animations` and `plotly.plotly.icreate_animations` which animate a figure with the `frames` argument.
- animations now work in online mode: use `plotly.plotly.create_animations` and `plotly.plotly.icreate_animations` which animate a figure with the `frames` argument. Here is a simple example:
```
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🐄 this is a little too much to stick in a changelog (imo) the bullet point is plenty i think. it's more consistent with what we typically do.

import plotly.plotly as py
from plotly.grid_objs import Grid, Column

column_1 = Column([0.5], 'x')
column_2 = Column([0.5], 'y')
column_3 = Column([1.5], 'x2')
column_4 = Column([1.5], 'y2')

grid = Grid([column_1, column_2, column_3, column_4])
py.grid_ops.upload(grid, 'ping_pong_grid', auto_open=False)

# create figure
figure = {
'data': [
{
'xsrc': grid.get_column_reference('x'),
'ysrc': grid.get_column_reference('y'),
'mode': 'markers',
}
],
'layout': {'title': 'Ping Pong Animation',
'xaxis': {'range': [0, 2], 'autorange': False},
'yaxis': {'range': [0, 2], 'autorange': False},
'updatemenus': [{
'buttons': [
{'args': [None],
'label': u'Play',
'method': u'animate'}
],
'pad': {'r': 10, 't': 87},
'showactive': False,
'type': 'buttons'
}]},
'frames': [
{
'data': [
{
'xsrc': grid.get_column_reference('x2'),
'ysrc': grid.get_column_reference('y2'),
'mode': 'markers',
}
]
},
{
'data': [
{
'xsrc': grid.get_column_reference('x'),
'ysrc': grid.get_column_reference('y'),
'mode': 'markers',
}
]
}
]
}

py.create_animations(figure, 'ping_pong')
```

### Fixed
- Trisurf now uses correct `Plotly Colorscales` when called
Expand Down
136 changes: 124 additions & 12 deletions plotly/plotly/plotly.py
Original file line number Diff line number Diff line change
Expand Up @@ -1517,36 +1517,148 @@ def create_animations(figure, filename=None, sharing='public', auto_open=True):
import plotly.plotly as py
from plotly.grid_objs import Grid, Column

column_1 = Column([1, 2, 3], 'x')
column_2 = Column([1, 3, 6], 'y')
column_3 = Column([2, 4, 6], 'new x')
column_4 = Column([1, 1, 5], 'new y')
column_1 = Column([0.5], 'x')
column_2 = Column([0.5], 'y')
column_3 = Column([1.5], 'x2')
column_4 = Column([1.5], 'y2')

grid = Grid([column_1, column_2, column_3, column_4])
py.grid_ops.upload(grid, 'animations_grid', auto_open=False)
py.grid_ops.upload(grid, 'ping_pong_grid', auto_open=False)

# create figure
figure = {
'data': [
{
'xsrc': grid.get_column_reference('x'),
'ysrc': grid.get_column_reference('y')
'ysrc': grid.get_column_reference('y'),
'mode': 'markers',
}
],
'layout': {'title': 'First Title'},
'layout': {'title': 'Ping Pong Animation',
'xaxis': {'range': [0, 2], 'autorange': False},
'yaxis': {'range': [0, 2], 'autorange': False},
'updatemenus': [{
'buttons': [
{'args': [None],
'label': u'Play',
'method': u'animate'}
],
'pad': {'r': 10, 't': 87},
'showactive': False,
'type': 'buttons'
}]},
'frames': [
{
'data': [
{
'xsrc': grid.get_column_reference('new x'),
'ysrc': grid.get_column_reference('new y')
'xsrc': grid.get_column_reference('x2'),
'ysrc': grid.get_column_reference('y2'),
'mode': 'markers',
}
]
},
{
'data': [
{
'xsrc': grid.get_column_reference('x'),
'ysrc': grid.get_column_reference('y'),
'mode': 'markers',
}
],
'layout': {'title': 'Second Title'}
]
}
]
}

py.create_animations(figure, 'new_plot_with_animations')
py.create_animations(figure, 'ping_pong')
```

Example 2: Growing Circles Animation
```
import plotly.plotly as py
from plotly.grid_objs import Grid, Column

column_1 = Column([0.9, 1.1], 'x')
column_2 = Column([1.0, 1.0], 'y')
column_3 = Column([0.8, 1.2], 'x2')
column_4 = Column([1.2, 0.8], 'y2')
column_5 = Column([0.7, 1.3], 'x3')
column_6 = Column([0.7, 1.3], 'y3')
column_7 = Column([0.6, 1.4], 'x4')
column_8 = Column([1.5, 0.5], 'y4')
column_9 = Column([0.4, 1.6], 'x5')
column_10 = Column([1.2, 0.8], 'y5')

grid = Grid([column_1, column_2, column_3, column_4, column_5,
column_6, column_7, column_8, column_9, column_10])
py.grid_ops.upload(grid, 'growing_circles_grid', auto_open=False)

# create figure
figure = {
'data': [
{
'xsrc': grid.get_column_reference('x'),
'ysrc': grid.get_column_reference('y'),
'mode': 'markers',
'marker': {'color': '#48186a', 'size': 10}
}
],
'layout': {'title': 'Growing Circles',
'xaxis': {'range': [0, 2], 'autorange': False},
'yaxis': {'range': [0, 2], 'autorange': False},
'updatemenus': [{
'buttons': [
{'args': [None],
'label': u'Play',
'method': u'animate'}
],
'pad': {'r': 10, 't': 87},
'showactive': False,
'type': 'buttons'
}]},
'frames': [
{
'data': [
{
'xsrc': grid.get_column_reference('x2'),
'ysrc': grid.get_column_reference('y2'),
'mode': 'markers',
'marker': {'color': '#3b528b', 'size': 25}
}
]
},
{
'data': [
{
'xsrc': grid.get_column_reference('x3'),
'ysrc': grid.get_column_reference('y3'),
'mode': 'markers',
'marker': {'color': '#26828e', 'size': 50}
}
]
},
{
'data': [
{
'xsrc': grid.get_column_reference('x4'),
'ysrc': grid.get_column_reference('y4'),
'mode': 'markers',
'marker': {'color': '#5ec962', 'size': 80}
}
]
},
{
'data': [
{
'xsrc': grid.get_column_reference('x5'),
'ysrc': grid.get_column_reference('y5'),
'mode': 'markers',
'marker': {'color': '#d8e219', 'size': 100}
}
]
}
]
}
py.create_animations(figure, 'growing_circles')
```
"""
credentials = get_credentials()
Expand Down