Skip to content

Instantly share code, notes, and snippets.

@jackparmer

jackparmer/gist:7d948acf4bc96a2b903e

Last active August 29, 2015 14:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jackparmer/7d948acf4bc96a2b903e to your computer and use it in GitHub Desktop.
Save jackparmer/7d948acf4bc96a2b903e to your computer and use it in GitHub Desktop.
Download ZIP
double money slider gif
Raw
gistfile1.json
{
"cells": [
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# Double slider widget for x axis range"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"##### Make horizontal slider widths 100%"
]
},
{
"cell_type": "code",
"execution_count": 48,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"text/html": [
"<style>.widget-hslider { width: 100%; }\n",
" .widget-hbox { width: 100% !important; }\n",
" .widget-slider { width: 100% !important; }</style>"
],
"text/plain": [
"<IPython.core.display.HTML object>"
]
},
"execution_count": 48,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"from IPython.core.display import HTML\n",
"\n",
"styles = '''<style>.widget-hslider { width: 100%; }\n",
" .widget-hbox { width: 100% !important; }\n",
" .widget-slider { width: 100% !important; }</style>'''\n",
"\n",
"HTML(styles)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"##### Widgets don't display in nbviewer; Here's a GIF to show how this works"
]
},
{
"cell_type": "code",
"execution_count": 51,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"text/html": [
"<img src=\"http://i.imgur.com/ptVBU5m.gif\"/>"
],
"text/plain": [
"<IPython.core.display.Image object>"
]
},
"execution_count": 51,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"from IPython.display import Image\n",
"Image(url='http://i.imgur.com/ptVBU5m.gif')"
]
},
{
"cell_type": "code",
"execution_count": 42,
"metadata": {
"collapsed": false
},
"outputs": [],
"source": [
"import plotly.plotly as py\n",
"from plotly.widgets import GraphWidget\n",
"from IPython.html import widgets \n",
"from IPython.display import display, clear_output"
]
},
{
"cell_type": "code",
"execution_count": 43,
"metadata": {
"collapsed": false
},
"outputs": [
{
"name": "stdout",
"output_type": "stream",
"text": [
"x-axis range is in Unix time (milliseconds) 9.92264266667e+11 9.92410933333e+11\n"
]
}
],
"source": [
"g = GraphWidget('https://plot.ly/~chriddyp/674')\n",
"xmin, xmax = py.get_figure(\"https://plot.ly/~chriddyp/674/\")['layout']['xaxis']['range']\n",
"print 'x-axis range is in Unix time (milliseconds)', xmin, xmax"
]
},
{
"cell_type": "code",
"execution_count": 44,
"metadata": {
"collapsed": false
},
"outputs": [],
"source": [
"class x_left:\n",
" def on_x_change(self, name, old_value, new_value):\n",
" g.relayout({ 'xaxis.range[0]': new_value })\n",
" \n",
"class x_right:\n",
" def on_x_change(self, name, old_value, new_value):\n",
" g.relayout({ 'xaxis.range[1]': new_value })\n",
" \n",
"\n",
"left_slider = widgets.FloatSliderWidget(min=xmin,max=xmax,value=xmin,step=(xmax-xmin)/1000.0)\n",
"left_slider.description = 'Left Axis'\n",
"left_slider.on_trait_change(x_left().on_x_change, 'value')\n",
"\n",
"right_slider = widgets.FloatSliderWidget(min=xmin,max=xmax,value=xmax,step=(xmax-xmin)/1000.0)\n",
"right_slider.description = 'Right Axis'\n",
"right_slider.on_trait_change(x_right().on_x_change, 'value')"
]
},
{
"cell_type": "code",
"execution_count": 46,
"metadata": {
"collapsed": false
},
"outputs": [],
"source": [
"display(g)\n",
"display(left_slider)\n",
"display(right_slider)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Call help() on a graph widget to reference its methods"
]
},
{
"cell_type": "code",
"execution_count": 14,
"metadata": {
"collapsed": false,
"scrolled": false
},
"outputs": [
{
"name": "stdout",
"output_type": "stream",
"text": [
"Help on GraphWidget in module plotly.widgets.graph_widget object:\n",
"\n",
"class GraphWidget(IPython.html.widgets.widget.DOMWidget)\n",
" | An interactive Plotly graph widget for use in IPython\n",
" | Notebooks.\n",
" | \n",
" | Method resolution order:\n",
" | GraphWidget\n",
" | IPython.html.widgets.widget.DOMWidget\n",
" | IPython.html.widgets.widget.Widget\n",
" | IPython.config.configurable.LoggingConfigurable\n",
" | IPython.config.configurable.Configurable\n",
" | IPython.utils.traitlets.HasTraits\n",
" | IPython.utils.traitlets._NewBase\n",
" | __builtin__.object\n",
" | \n",
" | Methods defined here:\n",
" | \n",
" | __init__(self, graph_url='https://plot.ly/~playground/7', **kwargs)\n",
" | Initialize a plotly graph widget\n",
" | \n",
" | Args:\n",
" | graph_url: The url of a Plotly graph\n",
" | \n",
" | Example:\n",
" | ```\n",
" | GraphWidget('https://plot.ly/~chris/3375')\n",
" | ```\n",
" | \n",
" | add_traces(self, traces, new_indices=None)\n",
" | Add new data traces to a graph.\n",
" | \n",
" | If `new_indices` isn't specified, they are simply appended.\n",
" | \n",
" | Args:\n",
" | traces (dict or list of dicts, or class of plotly.graph_objs):trace\n",
" | new_indices (list[int]|None), optional: The final indices the\n",
" | added traces should occupy in the graph.\n",
" | \n",
" | Examples:\n",
" | Initialization - Start each example below with this setup:\n",
" | ```\n",
" | from plotly.widgets import GraphWidget\n",
" | from plotly.graph_objs import Scatter\n",
" | from IPython.display import display\n",
" | \n",
" | graph = GraphWidget('https://plot.ly/~chris/3979')\n",
" | display(graph)\n",
" | ```\n",
" | \n",
" | Example 1 - Add a scatter/line trace to the graph\n",
" | ```\n",
" | graph.add_traces(Scatter(x = [1, 2, 3], y = [5, 4, 5]))\n",
" | ```\n",
" | \n",
" | Example 2 - Add a scatter trace and set it to to be the\n",
" | second trace. This will appear as the second\n",
" | item in the legend.\n",
" | ```\n",
" | graph.add_traces(Scatter(x = [1, 2, 3], y = [5, 6, 5]),\n",
" | new_indices=[1])\n",
" | ```\n",
" | \n",
" | Example 3 - Add multiple traces to the graph\n",
" | ```\n",
" | graph.add_traces([\n",
" | Scatter(x = [1, 2, 3], y = [5, 6, 5]),\n",
" | Scatter(x = [1, 2.5, 3], y = [5, 8, 5])\n",
" | ])\n",
" | ```\n",
" | \n",
" | delete_traces(self, indices)\n",
" | Delete data traces from a graph.\n",
" | \n",
" | Args:\n",
" | indices (list[int]): The indices of the traces to be removed\n",
" | \n",
" | Example - Delete the 2nd trace:\n",
" | ```\n",
" | from plotly.widgets import GraphWidget\n",
" | from IPython.display import display\n",
" | \n",
" | graph = GraphWidget('https://plot.ly/~chris/3979')\n",
" | display(graph)\n",
" | \n",
" | \n",
" | graph.delete_traces([1])\n",
" | ```\n",
" | \n",
" | extend_traces(self, update, indices=(0,), max_points=None)\n",
" | Append data points to existing traces in the Plotly graph.\n",
" | \n",
" | Args:\n",
" | update (dict):\n",
" | dict where keys are the graph attribute strings\n",
" | and values are arrays of arrays with values to extend.\n",
" | \n",
" | Each array in the array will extend a trace.\n",
" | \n",
" | Valid keys include:\n",
" | 'x', 'y', 'text,\n",
" | 'marker.color', 'marker.size', 'marker.symbol',\n",
" | 'marker.line.color', 'marker.line.width'\n",
" | \n",
" | indices (list, int):\n",
" | Specify which traces to apply the `update` dict to.\n",
" | If indices are not given, the update will apply to\n",
" | the traces in order.\n",
" | \n",
" | max_points (int or dict, optional):\n",
" | If specified, then only show the `max_points` most\n",
" | recent points in the graph.\n",
" | This is useful to prevent traces from becoming too\n",
" | large (and slow) or for creating \"windowed\" graphs\n",
" | in monitoring applications.\n",
" | \n",
" | To set max_points to different values for each trace\n",
" | or attribute, set max_points to a dict mapping keys\n",
" | to max_points values. See the examples below.\n",
" | \n",
" | Examples:\n",
" | Initialization - Start each example below with this setup:\n",
" | ```\n",
" | from plotly.widgets import GraphWidget\n",
" | from IPython.display import display\n",
" | \n",
" | graph = GraphWidget()\n",
" | graph.plot([\n",
" | {'x': [], 'y': []},\n",
" | {'x': [], 'y': []}\n",
" | ])\n",
" | \n",
" | display(graph)\n",
" | ```\n",
" | \n",
" | Example 1 - Extend the first trace with x and y data\n",
" | ```\n",
" | graph.extend_traces({'x': [[1, 2, 3]], 'y': [[10, 20, 30]]},\n",
" | indices=[0])\n",
" | ```\n",
" | \n",
" | Example 2 - Extend the second trace with x and y data\n",
" | ```\n",
" | graph.extend_traces({'x': [[1, 2, 3]], 'y': [[10, 20, 30]]},\n",
" | indices=[1])\n",
" | ```\n",
" | \n",
" | Example 3 - Extend the first two traces with x and y data\n",
" | ```\n",
" | graph.extend_traces({\n",
" | 'x': [[1, 2, 3], [2, 3, 4]],\n",
" | 'y': [[10, 20, 30], [3, 4, 3]]\n",
" | }, indices=[0, 1])\n",
" | ```\n",
" | \n",
" | Example 4 - Extend the first trace with x and y data and\n",
" | limit the length of data in that trace to 50\n",
" | points.\n",
" | ```\n",
" | \n",
" | graph.extend_traces({\n",
" | 'x': [range(100)],\n",
" | 'y': [range(100)]\n",
" | }, indices=[0, 1], max_points=50)\n",
" | ```\n",
" | \n",
" | Example 5 - Extend the first and second trace with x and y data\n",
" | and limit the length of data in the first trace to\n",
" | 25 points and the second trace to 50 points.\n",
" | ```\n",
" | new_points = range(100)\n",
" | graph.extend_traces({\n",
" | 'x': [new_points, new_points],\n",
" | 'y': [new_points, new_points]\n",
" | },\n",
" | indices=[0, 1],\n",
" | max_points={\n",
" | 'x': [25, 50],\n",
" | 'y': [25, 50]\n",
" | }\n",
" | )\n",
" | ```\n",
" | \n",
" | Example 6 - Update other attributes, like marker colors and\n",
" | sizes and text\n",
" | ```\n",
" | # Initialize a plot with some empty attributes\n",
" | graph.plot([{\n",
" | 'x': [],\n",
" | 'y': [],\n",
" | 'text': [],\n",
" | 'marker': {\n",
" | 'size': [],\n",
" | 'color': []\n",
" | }\n",
" | }])\n",
" | # Append some data into those attributes\n",
" | graph.extend_traces({\n",
" | 'x': [[1, 2, 3]],\n",
" | 'y': [[10, 20, 30]],\n",
" | 'text': [['A', 'B', 'C']],\n",
" | 'marker.size': [[10, 15, 20]],\n",
" | 'marker.color': [['blue', 'red', 'orange']]\n",
" | }, indices=[0])\n",
" | ```\n",
" | \n",
" | Example 7 - Live-update a graph over a few seconds\n",
" | ```\n",
" | import time\n",
" | \n",
" | graph.plot([{'x': [], 'y': []}])\n",
" | for i in range(10):\n",
" | graph.extend_traces({\n",
" | 'x': [[i]],\n",
" | 'y': [[i]]\n",
" | }, indices=[0])\n",
" | \n",
" | time.sleep(0.5)\n",
" | ```\n",
" | \n",
" | hover(self, *hover_objs)\n",
" | Show hover labels over the points specified in hover_obj.\n",
" | \n",
" | Hover labels are the labels that normally appear when the\n",
" | mouse hovers over points in the plotly graph.\n",
" | \n",
" | Args:\n",
" | hover_objs (tuple of dicts):\n",
" | Specifies which points to place hover labels over.\n",
" | \n",
" | The location of the hover labels is described by a dict with\n",
" | keys and'xval' and/or 'yval' or 'curveNumber' and 'pointNumber'\n",
" | and optional keys 'hovermode' and 'subplot'\n",
" | \n",
" | 'xval' and 'yval' specify the (x, y) coordinates to\n",
" | place the label.\n",
" | 'xval' and 'yval need to be close to a point drawn in a graph.\n",
" | \n",
" | 'curveNumber' and 'pointNumber' specify the trace number and\n",
" | the index theof the point in that trace respectively.\n",
" | \n",
" | 'subplot' describes which axes to the coordinates refer to.\n",
" | By default, it is equal to 'xy'. For example, to specify the\n",
" | second x-axis and the third y-axis, set 'subplot' to 'x2y3'\n",
" | \n",
" | 'hovermode' is either 'closest', 'x', or 'y'.\n",
" | When set to 'x', all data sharing the same 'x' coordinate will\n",
" | be shown on screen with corresponding trace labels.\n",
" | When set to 'y' all data sharing the same 'y' coordinates will\n",
" | be shown on the screen with corresponding trace labels.\n",
" | When set to 'closest', information about the data point closest\n",
" | to where the viewer is hovering will appear.\n",
" | \n",
" | Note: If 'hovermode' is 'x', only 'xval' needs to be set.\n",
" | If 'hovermode' is 'y', only 'yval' needs to be set.\n",
" | If 'hovermode' is 'closest', 'xval' and 'yval' both\n",
" | need to be set.\n",
" | \n",
" | Note: 'hovermode' can be toggled by the user in the graph\n",
" | toolbar.\n",
" | \n",
" | Note: It is not currently possible to apply multiple hover\n",
" | labels to points on different axes.\n",
" | \n",
" | Note: `hover` can only be called with multiple dicts if\n",
" | 'curveNumber' and 'pointNumber' are the keys of the dicts\n",
" | \n",
" | Examples:\n",
" | Initialization - Start each example below with this setup:\n",
" | ```\n",
" | from plotly.widgets import GraphWidget\n",
" | from IPython.display import display\n",
" | \n",
" | graph = GraphWidget('https://plot.ly/~chris/3979')\n",
" | display(graph)\n",
" | ```\n",
" | \n",
" | Example 1 - Apply a label to the (x, y) point (3, 2)\n",
" | ```\n",
" | graph.hover({'xval': 3, 'yval': 2, 'hovermode': 'closest'})\n",
" | ```\n",
" | \n",
" | Example 2 -Apply a labels to all the points with the x coordinate 3\n",
" | ```\n",
" | graph.hover({'xval': 3, 'hovermode': 'x'})\n",
" | ```\n",
" | \n",
" | Example 3 - Apply a label to the first point of the first trace\n",
" | and the second point of the second trace.\n",
" | ```\n",
" | graph.hover({'curveNumber': 0, 'pointNumber': 0},\n",
" | {'curveNumber': 1, 'pointNumber': 1})\n",
" | ```\n",
" | \n",
" | on_click(self, callback, remove=False)\n",
" | Assign a callback to click events propagated\n",
" | by clicking on point(s) in the Plotly graph.\n",
" | \n",
" | Args:\n",
" | callback (function): Callback function this is called\n",
" | on click events with the signature:\n",
" | callback(widget, hover_obj) -> None\n",
" | \n",
" | Args:\n",
" | widget (GraphWidget): The current instance\n",
" | of the graph widget that this callback is assigned to.\n",
" | \n",
" | click_obj (dict): a nested dict that describes\n",
" | which point(s) were clicked on.\n",
" | \n",
" | click_obj example:\n",
" | [\n",
" | {\n",
" | 'curveNumber': 1,\n",
" | 'pointNumber': 2,\n",
" | 'x': 4,\n",
" | 'y': 14\n",
" | }\n",
" | ]\n",
" | \n",
" | remove (bool, optional): If False, attach the callback.\n",
" | If True, remove the callback. Defaults to False.\n",
" | \n",
" | \n",
" | Returns:\n",
" | None\n",
" | \n",
" | Example:\n",
" | ```\n",
" | from IPython.display import display\n",
" | def message_handler(widget, msg):\n",
" | display(widget._graph_url)\n",
" | display(msg)\n",
" | \n",
" | g = GraphWidget('https://plot.ly/~chris/3375')\n",
" | display(g)\n",
" | \n",
" | g.on_click(message_handler)\n",
" | ```\n",
" | \n",
" | on_hover(self, callback, remove=False)\n",
" | Assign a callback to hover events propagated\n",
" | by hovering over points in the Plotly graph.\n",
" | \n",
" | Args:\n",
" | callback (function): Callback function this is called\n",
" | on hover events with the signature:\n",
" | callback(widget, hover_obj) -> None\n",
" | \n",
" | Args:\n",
" | widget (GraphWidget): The current instance\n",
" | of the graph widget that this callback is assigned to.\n",
" | \n",
" | hover_obj (dict): a nested dict that describes\n",
" | which point(s) was hovered over.\n",
" | \n",
" | hover_obj example:\n",
" | [\n",
" | {\n",
" | 'curveNumber': 1,\n",
" | 'pointNumber': 2,\n",
" | 'x': 4,\n",
" | 'y': 14\n",
" | }\n",
" | ]\n",
" | \n",
" | remove (bool, optional): If False, attach the callback.\n",
" | If True, remove the callback. Defaults to False.\n",
" | \n",
" | \n",
" | Returns:\n",
" | None\n",
" | \n",
" | Example:\n",
" | ```\n",
" | from IPython.display import display\n",
" | def message_handler(widget, hover_msg):\n",
" | display(widget._graph_url)\n",
" | display(hover_msg)\n",
" | \n",
" | g = GraphWidget('https://plot.ly/~chris/3375')\n",
" | display(g)\n",
" | \n",
" | g.on_hover(message_handler)\n",
" | ```\n",
" | \n",
" | on_zoom(self, callback, remove=False)\n",
" | Assign a callback to zoom events propagated\n",
" | by zooming in regions in the Plotly graph.\n",
" | \n",
" | Args:\n",
" | callback (function): Callback function this is called\n",
" | on zoom events with the signature:\n",
" | callback(widget, ranges) -> None\n",
" | \n",
" | Args:\n",
" | widget (GraphWidget): The current instance\n",
" | of the graph widget that this callback is assigned to.\n",
" | \n",
" | ranges (dict): A description of the\n",
" | region that was zoomed into.\n",
" | \n",
" | ranges example:\n",
" | {\n",
" | 'x': [1.8399058038561549, 2.16443359662],\n",
" | 'y': [4.640902872777017, 7.855677154582]\n",
" | }\n",
" | \n",
" | remove (bool, optional): If False, attach the callback.\n",
" | If True, remove the callback. Defaults to False.\n",
" | \n",
" | Returns:\n",
" | None\n",
" | \n",
" | Example:\n",
" | ```\n",
" | from IPython.display import display\n",
" | def message_handler(widget, ranges):\n",
" | display(widget._graph_url)\n",
" | display(ranges)\n",
" | \n",
" | g = GraphWidget('https://plot.ly/~chris/3375')\n",
" | display(g)\n",
" | \n",
" | g.on_zoom(message_handler)\n",
" | ```\n",
" | \n",
" | plot(self, figure_or_data, validate=True)\n",
" | Plot figure_or_data in the Plotly graph widget.\n",
" | \n",
" | Args:\n",
" | figure_or_data (dict, list, or plotly.graph_obj object):\n",
" | The standard Plotly graph object that describes Plotly\n",
" | graphs as used in `plotly.plotly.plot`. See examples\n",
" | of the figure_or_data in https://plot.ly/python/\n",
" | \n",
" | Returns: None\n",
" | \n",
" | Example 1 - Graph a scatter plot:\n",
" | ```\n",
" | from plotly.graph_objs import Scatter\n",
" | g = GraphWidget()\n",
" | g.plot([Scatter(x=[1, 2, 3], y=[10, 15, 13])])\n",
" | ```\n",
" | \n",
" | Example 2 - Graph a scatter plot with a title:\n",
" | ```\n",
" | from plotly.graph_objs import Scatter, Figure, Data\n",
" | fig = Figure(\n",
" | data = Data([\n",
" | Scatter(x=[1, 2, 3], y=[20, 15, 13])\n",
" | ]),\n",
" | layout = Layout(title='Experimental Data')\n",
" | )\n",
" | \n",
" | g = GraphWidget()\n",
" | g.plot(fig)\n",
" | ```\n",
" | \n",
" | Example 3 - Clear a graph widget\n",
" | ```\n",
" | from plotly.graph_objs import Scatter, Figure\n",
" | g = GraphWidget()\n",
" | g.plot([Scatter(x=[1, 2, 3], y=[10, 15, 13])])\n",
" | \n",
" | # Now clear it\n",
" | g.plot({}) # alternatively, g.plot(Figure())\n",
" | ```\n",
" | \n",
" | relayout(self, layout)\n",
" | Update the layout of the Plotly graph.\n",
" | \n",
" | Args:\n",
" | layout (dict):\n",
" | dict where keys are the graph attribute strings\n",
" | and values are the value of the graph attribute.\n",
" | \n",
" | To update graph objects that are nested, like\n",
" | the title of an axis, combine the keys with a period\n",
" | e.g. `xaxis.title`. To set a value of an element in an array,\n",
" | like an axis's range, use brackets, e.g. 'xaxis.range[0]'.\n",
" | To replace an entire nested object, just specify the value to\n",
" | the sub-object. See example 4 below.\n",
" | \n",
" | See all of the layout attributes in our reference documentation\n",
" | https://plot.ly/python/reference/#Layout\n",
" | Or by calling `help` on `plotly.graph_objs.Layout`\n",
" | \n",
" | Examples - Start each example below with this setup:\n",
" | Initialization:\n",
" | ```\n",
" | from plotly.widgets import GraphWidget\n",
" | from IPython.display import display\n",
" | \n",
" | graph = GraphWidget('https://plot.ly/~chris/3979')\n",
" | display(graph)\n",
" | ```\n",
" | \n",
" | Example 1 - Update the title\n",
" | ```\n",
" | graph.relayout({'title': 'Experimental results'})\n",
" | ```\n",
" | \n",
" | Example 2 - Update the xaxis range\n",
" | ```\n",
" | graph.relayout({'xaxis.range': [-1, 6]})\n",
" | ```\n",
" | \n",
" | Example 3 - Update the first element of the xaxis range\n",
" | ```\n",
" | graph.relayout({'xaxis.range[0]': -3})\n",
" | ```\n",
" | \n",
" | Example 4 - Replace the entire xaxis object\n",
" | ```\n",
" | graph.relayout({'xaxis': {'title': 'Experimental results'}})\n",
" | ```\n",
" | \n",
" | reorder_traces(self, current_indices, new_indices=None)\n",
" | Reorder the traces in a graph.\n",
" | \n",
" | The order of the traces determines the order of the legend entries\n",
" | and the layering of the objects drawn in the graph, i.e. the first\n",
" | trace is drawn first and the second trace is drawn on top of the\n",
" | first trace.\n",
" | \n",
" | Args:\n",
" | current_indices (list[int]): The index of the traces to reorder.\n",
" | \n",
" | new_indices (list[int], optional): The index of the traces\n",
" | specified by `current_indices` after ordering.\n",
" | If None, then move the traces to the end.\n",
" | \n",
" | Examples:\n",
" | Example 1 - Move the first trace to the second to last\n",
" | position, the second trace to the last position\n",
" | ```\n",
" | graph.move_traces([0, 1])\n",
" | ```\n",
" | \n",
" | Example 2 - Move the first trace to the second position,\n",
" | the second trace to the first position.\n",
" | ```\n",
" | graph.move_traces([0], [1])\n",
" | ```\n",
" | \n",
" | restyle(self, update, indices=None)\n",
" | Update the style of existing traces in the Plotly graph.\n",
" | \n",
" | Args:\n",
" | update (dict):\n",
" | dict where keys are the graph attribute strings\n",
" | and values are the value of the graph attribute.\n",
" | \n",
" | To update graph objects that are nested, like\n",
" | a marker's color, combine the keys with a period,\n",
" | e.g. `marker.color`. To replace an entire nested object,\n",
" | like `marker`, set the value to the object.\n",
" | See Example 2 below.\n",
" | \n",
" | To update an attribute of multiple traces, set the\n",
" | value to an list of values. If the list is shorter\n",
" | than the number of traces, the values will wrap around.\n",
" | Note: this means that for values that are naturally an array,\n",
" | like `x` or `colorscale`, you need to wrap the value\n",
" | in an extra array,\n",
" | i.e. {'colorscale': [[[0, 'red'], [1, 'green']]]}\n",
" | \n",
" | You can also supply values to different traces with the\n",
" | indices argument.\n",
" | \n",
" | See all of the graph attributes in our reference documentation\n",
" | here: https://plot.ly/python/reference or by calling `help` on\n",
" | graph objects in `plotly.graph_objs`.\n",
" | \n",
" | indices (list, optional):\n",
" | Specify which traces to apply the update dict to.\n",
" | Negative indices are supported.\n",
" | If indices are not given, the update will apply to\n",
" | *all* traces.\n",
" | \n",
" | Examples:\n",
" | Initialization - Start each example below with this setup:\n",
" | ```\n",
" | from plotly.widgets import GraphWidget\n",
" | from IPython.display import display\n",
" | \n",
" | graph = GraphWidget()\n",
" | display(graph)\n",
" | ```\n",
" | \n",
" | Example 1 - Set `marker.color` to red in every trace in the graph\n",
" | ```\n",
" | graph.restyle({'marker.color': 'red'})\n",
" | ```\n",
" | \n",
" | Example 2 - Replace `marker` with {'color': 'red'}\n",
" | ```\n",
" | graph.restyle({'marker': {'color': red'}})\n",
" | ```\n",
" | \n",
" | Example 3 - Set `marker.color` to red\n",
" | in the first trace of the graph\n",
" | ```\n",
" | graph.restyle({'marker.color': 'red'}, indices=[0])\n",
" | ```\n",
" | \n",
" | Example 4 - Set `marker.color` of all of the traces to\n",
" | alternating sequences of red and green\n",
" | ```\n",
" | graph.restyle({'marker.color': ['red', 'green']})\n",
" | ```\n",
" | \n",
" | Example 5 - Set just `marker.color` of the first two traces\n",
" | to red and green\n",
" | ```\n",
" | graph.restyle({'marker.color': ['red', 'green']}, indices=[0, 1])\n",
" | ```\n",
" | \n",
" | Example 6 - Set multiple attributes of all of the traces\n",
" | ```\n",
" | graph.restyle({\n",
" | 'marker.color': 'red',\n",
" | 'line.color': 'green'\n",
" | })\n",
" | ```\n",
" | \n",
" | Example 7 - Update the data of the first trace\n",
" | ```\n",
" | graph.restyle({\n",
" | 'x': [[1, 2, 3]],\n",
" | 'y': [[10, 20, 30]],\n",
" | }, indices=[0])\n",
" | ```\n",
" | \n",
" | Example 8 - Update the data of the first two traces\n",
" | ```\n",
" | graph.restyle({\n",
" | 'x': [[1, 2, 3],\n",
" | [1, 2, 4]],\n",
" | 'y': [[10, 20, 30],\n",
" | [5, 8, 14]],\n",
" | }, indices=[0, 1])\n",
" | ```\n",
" | \n",
" | save(self, ignore_defaults=False, filename='')\n",
" | Save a copy of the current state of the widget in plotly.\n",
" | \n",
" | :param (bool) ignore_defaults: Auto-fill in unspecified figure keys?\n",
" | :param (str) filename: Name of the file on plotly.\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Data descriptors defined here:\n",
" | \n",
" | url\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Data descriptors inherited from IPython.html.widgets.widget.DOMWidget:\n",
" | \n",
" | background_color\n",
" | A trait for unicode strings.\n",
" | \n",
" | border_color\n",
" | A trait for unicode strings.\n",
" | \n",
" | border_radius\n",
" | A casting version of the unicode trait.\n",
" | \n",
" | border_style\n",
" | An enum of strings that are caseless in validate.\n",
" | \n",
" | border_width\n",
" | A casting version of the unicode trait.\n",
" | \n",
" | color\n",
" | A trait for unicode strings.\n",
" | \n",
" | font_family\n",
" | A trait for unicode strings.\n",
" | \n",
" | font_size\n",
" | A casting version of the unicode trait.\n",
" | \n",
" | font_style\n",
" | An enum of strings that are caseless in validate.\n",
" | \n",
" | font_weight\n",
" | An enum of strings that are caseless in validate.\n",
" | \n",
" | height\n",
" | A casting version of the unicode trait.\n",
" | \n",
" | margin\n",
" | A casting version of the unicode trait.\n",
" | \n",
" | padding\n",
" | A casting version of the unicode trait.\n",
" | \n",
" | visible\n",
" | A boolean (True, False) trait.\n",
" | \n",
" | width\n",
" | A casting version of the unicode trait.\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Methods inherited from IPython.html.widgets.widget.Widget:\n",
" | \n",
" | __del__(self)\n",
" | Object disposal\n",
" | \n",
" | close(self)\n",
" | Close method.\n",
" | \n",
" | Closes the underlying comm.\n",
" | When the comm is closed, all of the widget views are automatically\n",
" | removed from the front-end.\n",
" | \n",
" | get_state(self, key=None)\n",
" | Gets the widget state, or a piece of it.\n",
" | \n",
" | Parameters\n",
" | ----------\n",
" | key : unicode or iterable (optional)\n",
" | A single property's name or iterable of property names to get.\n",
" | \n",
" | hold_sync(*args, **kwds)\n",
" | Hold syncing any state until the context manager is released\n",
" | \n",
" | on_displayed(self, callback, remove=False)\n",
" | (Un)Register a widget displayed callback.\n",
" | \n",
" | Parameters\n",
" | ----------\n",
" | callback: method handler\n",
" | Must have a signature of::\n",
" | \n",
" | callback(widget, **kwargs)\n",
" | \n",
" | kwargs from display are passed through without modification.\n",
" | remove: bool\n",
" | True if the callback should be unregistered.\n",
" | \n",
" | on_msg(self, callback, remove=False)\n",
" | (Un)Register a custom msg receive callback.\n",
" | \n",
" | Parameters\n",
" | ----------\n",
" | callback: callable\n",
" | callback will be passed two arguments when a message arrives::\n",
" | \n",
" | callback(widget, content)\n",
" | \n",
" | remove: bool\n",
" | True if the callback should be unregistered.\n",
" | \n",
" | open(self)\n",
" | Open a comm to the frontend if one isn't already open.\n",
" | \n",
" | send(self, content)\n",
" | Sends a custom msg to the widget model in the front-end.\n",
" | \n",
" | Parameters\n",
" | ----------\n",
" | content : dict\n",
" | Content of the message to send.\n",
" | \n",
" | send_state(self, key=None)\n",
" | Sends the widget state, or a piece of it, to the front-end.\n",
" | \n",
" | Parameters\n",
" | ----------\n",
" | key : unicode, or iterable (optional)\n",
" | A single property's name or iterable of property names to sync with the front-end.\n",
" | \n",
" | set_state(self, sync_data)\n",
" | Called when a state is received from the front-end.\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Static methods inherited from IPython.html.widgets.widget.Widget:\n",
" | \n",
" | handle_comm_opened(comm, msg)\n",
" | Static method, called when a widget is constructed.\n",
" | \n",
" | on_widget_constructed(callback)\n",
" | Registers a callback to be called when a widget is constructed.\n",
" | \n",
" | The callback must have the following signature:\n",
" | callback(widget)\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Data descriptors inherited from IPython.html.widgets.widget.Widget:\n",
" | \n",
" | comm\n",
" | A trait whose value must be an instance of a specified class.\n",
" | \n",
" | The value can also be an instance of a subclass of the specified class.\n",
" | \n",
" | Subclasses can declare default classes by overriding the klass attribute\n",
" | \n",
" | keys\n",
" | An instance of a Python list.\n",
" | \n",
" | model_id\n",
" | Gets the model id of this widget.\n",
" | \n",
" | If a Comm doesn't exist yet, a Comm will be created automagically.\n",
" | \n",
" | msg_throttle\n",
" | An int trait.\n",
" | \n",
" | version\n",
" | An int trait.\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Data and other attributes inherited from IPython.html.widgets.widget.Widget:\n",
" | \n",
" | widget_types = {'IPython.Accordion': <class 'IPython.html.widgets.widg...\n",
" | \n",
" | widgets = {u'12f3548cbcf04979babc55c836358c04': <plotly.widgets.graph_...\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Data descriptors inherited from IPython.config.configurable.LoggingConfigurable:\n",
" | \n",
" | log\n",
" | A trait whose value must be an instance of a specified class.\n",
" | \n",
" | The value can also be an instance of a subclass of the specified class.\n",
" | \n",
" | Subclasses can declare default classes by overriding the klass attribute\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Methods inherited from IPython.config.configurable.Configurable:\n",
" | \n",
" | update_config(self, config)\n",
" | Fire the traits events when the config is updated.\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Class methods inherited from IPython.config.configurable.Configurable:\n",
" | \n",
" | class_config_section(cls) from IPython.utils.traitlets.MetaHasTraits\n",
" | Get the config class config section\n",
" | \n",
" | class_get_help(cls, inst=None) from IPython.utils.traitlets.MetaHasTraits\n",
" | Get the help string for this class in ReST format.\n",
" | \n",
" | If `inst` is given, it's current trait values will be used in place of\n",
" | class defaults.\n",
" | \n",
" | class_get_trait_help(cls, trait, inst=None) from IPython.utils.traitlets.MetaHasTraits\n",
" | Get the help string for a single trait.\n",
" | \n",
" | If `inst` is given, it's current trait values will be used in place of\n",
" | the class default.\n",
" | \n",
" | class_print_help(cls, inst=None) from IPython.utils.traitlets.MetaHasTraits\n",
" | Get the help string for a single trait and print it.\n",
" | \n",
" | section_names(cls) from IPython.utils.traitlets.MetaHasTraits\n",
" | return section names as a list\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Data descriptors inherited from IPython.config.configurable.Configurable:\n",
" | \n",
" | config\n",
" | A trait whose value must be an instance of a specified class.\n",
" | \n",
" | The value can also be an instance of a subclass of the specified class.\n",
" | \n",
" | Subclasses can declare default classes by overriding the klass attribute\n",
" | \n",
" | parent\n",
" | A trait whose value must be an instance of a specified class.\n",
" | \n",
" | The value can also be an instance of a subclass of the specified class.\n",
" | \n",
" | Subclasses can declare default classes by overriding the klass attribute\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Methods inherited from IPython.utils.traitlets.HasTraits:\n",
" | \n",
" | on_trait_change(self, handler, name=None, remove=False)\n",
" | Setup a handler to be called when a trait changes.\n",
" | \n",
" | This is used to setup dynamic notifications of trait changes.\n",
" | \n",
" | Static handlers can be created by creating methods on a HasTraits\n",
" | subclass with the naming convention '_[traitname]_changed'. Thus,\n",
" | to create static handler for the trait 'a', create the method\n",
" | _a_changed(self, name, old, new) (fewer arguments can be used, see\n",
" | below).\n",
" | \n",
" | Parameters\n",
" | ----------\n",
" | handler : callable\n",
" | A callable that is called when a trait changes. Its\n",
" | signature can be handler(), handler(name), handler(name, new)\n",
" | or handler(name, old, new).\n",
" | name : list, str, None\n",
" | If None, the handler will apply to all traits. If a list\n",
" | of str, handler will apply to all names in the list. If a\n",
" | str, the handler will apply just to that name.\n",
" | remove : bool\n",
" | If False (the default), then install the handler. If True\n",
" | then unintall it.\n",
" | \n",
" | trait_metadata(self, traitname, key, default=None)\n",
" | Get metadata values for trait by key.\n",
" | \n",
" | trait_names(self, **metadata)\n",
" | Get a list of all the names of this class' traits.\n",
" | \n",
" | traits(self, **metadata)\n",
" | Get a `dict` of all the traits of this class. The dictionary\n",
" | is keyed on the name and the values are the TraitType objects.\n",
" | \n",
" | The TraitTypes returned don't know anything about the values\n",
" | that the various HasTrait's instances are holding.\n",
" | \n",
" | The metadata kwargs allow functions to be passed in which\n",
" | filter traits based on metadata values. The functions should\n",
" | take a single value as an argument and return a boolean. If\n",
" | any function returns False, then the trait is not included in\n",
" | the output. This does not allow for any simple way of\n",
" | testing that a metadata name exists and has any\n",
" | value because get_metadata returns None if a metadata key\n",
" | doesn't exist.\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Class methods inherited from IPython.utils.traitlets.HasTraits:\n",
" | \n",
" | class_trait_names(cls, **metadata) from IPython.utils.traitlets.MetaHasTraits\n",
" | Get a list of all the names of this class' traits.\n",
" | \n",
" | This method is just like the :meth:`trait_names` method,\n",
" | but is unbound.\n",
" | \n",
" | class_traits(cls, **metadata) from IPython.utils.traitlets.MetaHasTraits\n",
" | Get a `dict` of all the traits of this class. The dictionary\n",
" | is keyed on the name and the values are the TraitType objects.\n",
" | \n",
" | This method is just like the :meth:`traits` method, but is unbound.\n",
" | \n",
" | The TraitTypes returned don't know anything about the values\n",
" | that the various HasTrait's instances are holding.\n",
" | \n",
" | The metadata kwargs allow functions to be passed in which\n",
" | filter traits based on metadata values. The functions should\n",
" | take a single value as an argument and return a boolean. If\n",
" | any function returns False, then the trait is not included in\n",
" | the output. This does not allow for any simple way of\n",
" | testing that a metadata name exists and has any\n",
" | value because get_metadata returns None if a metadata key\n",
" | doesn't exist.\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Static methods inherited from IPython.utils.traitlets.HasTraits:\n",
" | \n",
" | __new__(cls, *args, **kw)\n",
" | \n",
" | ----------------------------------------------------------------------\n",
" | Data descriptors inherited from IPython.utils.traitlets._NewBase:\n",
" | \n",
" | __dict__\n",
" | dictionary for instance variables (if defined)\n",
" | \n",
" | __weakref__\n",
" | list of weak references to the object (if defined)\n",
"\n"
]
}
],
"source": [
"help(g)"
]
},
{
"cell_type": "code",
"execution_count": 15,
"metadata": {
"collapsed": false
},
"outputs": [
{
"data": {
"text/html": [
"<style>\n",
"\n",
"html {\n",
" font-size: 62.5% !important; }\n",
"body {\n",
" font-size: 1.5em !important; /* currently ems cause chrome bug misinterpreting rems on body element */\n",
" line-height: 1.6 !important;\n",
" font-weight: 400 !important;\n",
" font-family: \"Raleway\", \"HelveticaNeue\", \"Helvetica Neue\", Helvetica, Arial, sans-serif !important;\n",
" color: #222 !important; }\n",
"\n",
"div{ border-radius: 0px !important; }\n",
"div.CodeMirror-sizer{ background: rgb(244, 244, 248) !important; }\n",
"div.input_area{ background: rgb(244, 244, 248) !important; }\n",
"\n",
"div.out_prompt_overlay:hover{ background: rgb(244, 244, 248) !important; }\n",
"div.input_prompt:hover{ background: rgb(244, 244, 248) !important; }\n",
"\n",
"h1, h2, h3, h4, h5, h6 {\n",
" color: #333 !important;\n",
" margin-top: 0 !important;\n",
" margin-bottom: 2rem !important;\n",
" font-weight: 300 !important; }\n",
"h1 { font-size: 4.0rem !important; line-height: 1.2 !important; letter-spacing: -.1rem !important;}\n",
"h2 { font-size: 3.6rem !important; line-height: 1.25 !important; letter-spacing: -.1rem !important; }\n",
"h3 { font-size: 3.0rem !important; line-height: 1.3 !important; letter-spacing: -.1rem !important; }\n",
"h4 { font-size: 2.4rem !important; line-height: 1.35 !important; letter-spacing: -.08rem !important; }\n",
"h5 { font-size: 1.8rem !important; line-height: 1.5 !important; letter-spacing: -.05rem !important; }\n",
"h6 { font-size: 1.5rem !important; line-height: 1.6 !important; letter-spacing: 0 !important; }\n",
"\n",
"@media (min-width: 550px) {\n",
" h1 { font-size: 5.0rem !important; }\n",
" h2 { font-size: 4.2rem !important; }\n",
" h3 { font-size: 3.6rem !important; }\n",
" h4 { font-size: 3.0rem !important; }\n",
" h5 { font-size: 2.4rem !important; }\n",
" h6 { font-size: 1.5rem !important; }\n",
"}\n",
"\n",
"p {\n",
" margin-top: 0 !important; }\n",
" \n",
"a {\n",
" color: #1EAEDB !important; }\n",
"a:hover {\n",
" color: #0FA0CE !important; }\n",
" \n",
"code {\n",
" padding: .2rem .5rem !important;\n",
" margin: 0 .2rem !important;\n",
" font-size: 90% !important;\n",
" white-space: nowrap !important;\n",
" background: #F1F1F1 !important;\n",
" border: 1px solid #E1E1E1 !important;\n",
" border-radius: 4px !important; }\n",
"pre > code {\n",
" display: block !important;\n",
" padding: 1rem 1.5rem !important;\n",
" white-space: pre !important; }\n",
" \n",
"button{ border-radius: 0px !important; }\n",
".navbar-inner{ background-image: none !important; }\n",
"select, textarea{ border-radius: 0px !important; }\n",
"\n",
"</style>"
],
"text/plain": [
"<IPython.core.display.HTML object>"
]
},
"execution_count": 15,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"# CSS styling within IPython notebook - feel free to re-use\n",
"from IPython.core.display import HTML\n",
"import urllib2\n",
"\n",
"HTML(urllib2.urlopen('http://bit.ly/1Bf5Hft').read())"
]
}
],
"metadata": {
"kernelspec": {
"display_name": "Python 2",
"language": "python",
"name": "python2"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 2
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython2",
"version": "2.7.10"
}
},
"nbformat": 4,
"nbformat_minor": 0
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment