### Setup and Contribution Workflow

Source: https://github.com/kitware/trame-plotly/blob/master/CONTRIBUTING.rst

This snippet details the initial steps for contributing to the trame-plotly project, including cloning the repository, installing and configuring pre-commit hooks, and the general workflow for making and submitting code changes.

```bash
git clone <repository_url>
pip install pre-commit
pre-commit install
# Make changes, commit, push to fork, and open pull request
```

--------------------------------

### Install trame-plotly

Source: https://github.com/kitware/trame-plotly/blob/master/README.rst

Installs or upgrades the trame-plotly package using pip. This is the standard way to get the library.

```bash
pip install --upgrade trame-plotly
```

--------------------------------

### Basic Trame Plotly Integration

Source: https://github.com/kitware/trame-plotly/blob/master/examples/requirements.txt

Demonstrates a simple integration of Trame with Plotly to display a basic chart. This example requires the Plotly and Trame libraries to be installed.

```python
from trame.app import get_app
from trame.ui.vuetify import SinglePageLayout
from trame.widgets import Plotly

import plotly.graph_objects as go

# Create a simple Plotly figure
fig = go.Figure(data=go.Bar(y=[1, 3, 2, 4]))

# Initialize Trame application
app = get_app()

# Create a Plotly widget
plotly_widget = Plotly(fig)

# Define the UI layout
with SinglePageLayout(server=app) as layout:
    layout.title.text = "Trame Plotly Example"
    layout.content.add(plotly_widget)

# Run the application
if __name__ == "__main__":
    app.run()

```

--------------------------------

### Trame Plotly with Pandas DataFrames

Source: https://github.com/kitware/trame-plotly/blob/master/examples/requirements.txt

Shows how to use Trame and Plotly with Pandas DataFrames for creating visualizations from structured data. Ensure Pandas, Plotly, and Trame are installed.

```python
from trame.app import get_app
from trame.ui.vuetify import SinglePageLayout
from trame.widgets import Plotly

import plotly.express as px
import pandas as pd

# Create a sample Pandas DataFrame
data = {
    'Category': ['A', 'B', 'C', 'D', 'E'],
    'Values': [10, 25, 15, 30, 20]
}
df = pd.DataFrame(data)

# Create a Plotly figure from the DataFrame
fig = px.bar(df, x='Category', y='Values', title='Pandas DataFrame Visualization')

# Initialize Trame application
app = get_app()

# Create a Plotly widget
plotly_widget = Plotly(fig)

# Define the UI layout
with SinglePageLayout(server=app) as layout:
    layout.title.text = "Trame Plotly Pandas Example"
    layout.content.add(plotly_widget)

# Run the application
if __name__ == "__main__":
    app.run()

```

--------------------------------

### Pre-commit Hook Execution

Source: https://github.com/kitware/trame-plotly/blob/master/CONTRIBUTING.rst

This command runs all pre-commit hooks on all files in the repository. It's recommended to run this when starting a new project or after significant changes to ensure all code adheres to the project's standards.

```bash
pre-commit run --all-files
```

--------------------------------

### Flake8 Configuration

Source: https://github.com/kitware/trame-plotly/blob/master/CONTRIBUTING.rst

This entry refers to configuring the flake8 linter. Users can add options to their .flake8 file to resolve disagreements between black and flake8 or to customize linting rules.

```APIDOC
Flake8 Configuration:
  Description: Customize flake8 linting behavior by modifying the .flake8 file.
  Usage: Add options to the .flake8 file to resolve conflicts or set specific rules.
  Example Configuration:
    [flake8]
    ignore = E203, W503
  Related Tools: black, pre-commit
  Documentation: https://flake8.pycqa.org/en/latest/user/configuration.html
```

--------------------------------

### Codespell Configuration

Source: https://github.com/kitware/trame-plotly/blob/master/CONTRIBUTING.rst

This entry describes how to configure codespell using a .codespellrc file. This allows for fine-grained control over which words, files, or directories are ignored during spell checking.

```APIDOC
Codespell Configuration (.codespellrc):
  Description: Configure codespell to ignore specific files, directories, or words.
  Usage: Create a .codespellrc file in the repository root to specify ignore patterns.
  Example Configuration:
    [codespell]
    ignore-words = file1,dir2,word3
    skip = *.log,temp/
  Related Tools: codespell
  Documentation: https://github.com/codespell-project/codespell#using-a-config-file
```

--------------------------------

### Create Plotly Figure with JavaScript Data

Source: https://github.com/kitware/trame-plotly/blob/master/README.rst

Illustrates creating a Plotly chart by directly providing data, layout, and configuration options in a JavaScript-compatible format. This allows for more granular control over the chart's appearance and behavior.

```python
from trame.widgets import plotly

# https://plotly.com/javascript/reference/
plotly_data = [
  {
    "x": [1,2,3,4],
    "y": [10,15,13,17],
    "type": "scatter",
  }
]

# https://plotly.com/javascript/reference/layout/
plotly_layout = {
  "title": "My graph",
}

# https://plotly.com/javascript/configuration-options/
plotly_options = {
  "scroll_zoom": True,
  "editable": True,
  "static_plot": True,
  "to_image_options": {
    "format": "svg", # one of png, svg, jpeg, webp
    "filename": "custom_image",
    "height": 500,
    "width": 700,
    "scale": 1 # Multiply title/legend/axis/canvas sizes by this factor
  },
  "display_mode_bar": True,
  "mode_bar_buttons_to_remove": [
    "zoom2d", "pan2d", "select2d", "lasso2d", "zoomIn2d", "zoomOut2d", "autoScale2d", "resetScale2d", # 2D
    "zoom3d", "pan3d", "orbitRotation", "tableRotation", "handleDrag3d", "resetCameraDefault3d", "resetCameraLastSave3d", "hoverClosest3d", # 3D
    "hoverClosestCartesian", "hoverCompareCartesian", # Cartesian
    "zoomInGeo", "zoomOutGeo", "resetGeo", "hoverClosestGeo", # Geo
    "hoverClosestGl2d", "hoverClosestPie", "toggleHover", "resetViews", "toImage", "sendDataToCloud", "toggleSpikelines", "resetViewMapbox", # Other
  ],
  "mode_bar_buttons_to_add": [
    {
      "name": 'color toggler',
      "icon": icon1, # https://plotly.com/javascript/configuration-options/#add-buttons-to-modebar
      "click": "...",
    },
  ],
  "locale": "fr",
  "display_logo": False,
  "responsive": True,
  "double_click_delay": 1000,
}

# Hand made chart
chart = plotly.Figure(
  data=("chart_data", plotly_data),
  layout=("chart_layout", plotly_layout),
  **plotly_options,
)
```

--------------------------------

### Black Code Formatting

Source: https://github.com/kitware/trame-plotly/blob/master/CONTRIBUTING.rst

This command formats Python code according to the black formatter's standards. It's a quick way to fix formatting issues before committing.

```bash
pip install black
black .
```

--------------------------------

### Create Plotly Figure with Python

Source: https://github.com/kitware/trame-plotly/blob/master/README.rst

Demonstrates how to create a Plotly figure using the Python API and then render it using the trame-plotly widget. It shows updating the figure with new data.

```python
import plotly.graph_objects as go
from trame.widgets import plotly

fig = go.Figure(
    data=go.Contour(
        z=[
            [10, 10.625, 12.5, 15.625, 20],
            [5.625, 6.25, 8.125, 11.25, 15.625],
            [2.5, 3.125, 5.0, 8.125, 12.5],
            [0.625, 1.25, 3.125, 6.25, 10.625],
            [0, 0.625, 2.5, 5.625, 10],
        ]
    )
)
fig2 = go.Figure(
    data=go.Contour(
        z=[
            [5.625, 6.25, 8.125, 11.25, 15.625],
            [2.5, 3.125, 5.0, 8.125, 12.5],
            [10, 10.625, 12.5, 15.625, 20],
            [0.625, 1.25, 3.125, 6.25, 10.625],
            [0, 0.625, 2.5, 5.625, 10],
        ]
    )
)

widget = plotly.Figure(fig)
widget.update(fig2)
```

--------------------------------

### Trame-Plotly Configuration Options

Source: https://github.com/kitware/trame-plotly/blob/master/README.rst

This section lists the various configuration options available for customizing Plotly plots within Trame applications. These options control aspects like data display, layout, interactivity, and export functionality.

```python
data, layout, display_mode_bar, scroll_zoom, editable, static_plot, to_image_options, mode_bar_buttons_to_remove, mode_bar_buttons_to_add, locale, display_logo, responsive, double_click_delay
```

--------------------------------

### Trame-Plotly Event Handling

Source: https://github.com/kitware/trame-plotly/blob/master/README.rst

This section details the events that can be handled within trame-plotly applications. These events allow for dynamic updates and user interaction with Plotly charts rendered via Trame.

```python
after_export, after_plot, animated, animating_frame, animation_interrupted, auto_size, before_export, button_clicked, click, click_annotation, deselect, double_click, framework, hover, legend_click, legend_double_click, relayout, restyle, redraw, selected, selecting, slider_change, slider_end, slider_start, transitioning, transition_interrupted, unhover
```

--------------------------------

### JavaScript Dependency

Source: https://github.com/kitware/trame-plotly/blob/master/README.rst

This snippet indicates the bundled JavaScript library for trame-plotly, specifying its version. It also provides information on how to request upgrades.

```javascript
plotly.js-dist-min@3.0.0
```

--------------------------------

### Codespell for Typo Correction

Source: https://github.com/kitware/trame-plotly/blob/master/CONTRIBUTING.rst

This command checks for common spelling errors in the codebase. The -w flag writes the corrections directly to the files.

```bash
pip install codespell
codespell -w
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.