You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Great! Your server is now running. Keep this terminal window open while you work through the tutorial.
@@ -65,7 +69,7 @@ Great! Your server is now running. Keep this terminal window open while you work
65
69
66
70
Let's create your first interactive visualization using the web interface.
67
71
68
-
Open your web browser and navigate to [`http://127.0.0.1:5005/add`](http://127.0.0.1:5005/add). You'll see a form for creating visualizations.
72
+
Open your web browser and navigate to [`http://localhost:5005/add`](http://localhost:5005/add). You'll see a form for creating visualizations.
69
73
70
74
Now, let's create a simple bar chart. In the code editor, enter the following Python code:
71
75
@@ -98,7 +102,7 @@ Click the **Submit** button. You should see a success message with a link to vie
98
102
99
103
## Step 4: View Your Visualization
100
104
101
-
After submitting your code, click the link provided on the Add page. This will take you to a unique URL like `http://127.0.0.1:5005/view?id=abc123` where your visualization is displayed.
105
+
After submitting your code, click the link provided on the Add page. This will take you to a unique URL like `http://localhost:5005/view?id=abc123` where your visualization is displayed.
@@ -111,7 +115,7 @@ You should now see your interactive bar chart! Try hovering over the bars - you'
111
115
112
116
As you create more visualizations, you'll want an easy way to browse them. Let's check out the Feed page.
113
117
114
-
Navigate to [`http://127.0.0.1:5005/feed`](http://127.0.0.1:5005/feed). Here you'll see a list view of your recent visualizations, including:
118
+
Navigate to [`http://localhost:5005/feed`](http://localhost:5005/feed). Here you'll see a list view of your recent visualizations, including:
115
119
116
120
- The visualization name and description
117
121
- When it was created
@@ -125,7 +129,7 @@ The Feed page automatically updates to show your most recent work.
125
129
126
130
Now let's explore the Admin page where you can manage all your visualizations.
127
131
128
-
Visit [`http://127.0.0.1:5005/admin`](http://127.0.0.1:5005/admin). This page provides a table view of all your snippets where you can:
132
+
Visit [`http://localhost:5005/admin`](http://localhost:5005/admin). This page provides a table view of all your snippets where you can:
129
133
130
134
- See detailed information about each snippet
131
135
- Delete visualizations you no longer need
@@ -176,7 +180,7 @@ import requests
176
180
177
181
# Create a visualization
178
182
response = requests.post(
179
-
"http://127.0.0.1:5005/api/snippet",
183
+
"http://localhost:5005/api/snippet",
180
184
headers={"Content-Type": "application/json"},
181
185
json={
182
186
"code": "a='Hello, HoloViz MCP!'\na",
@@ -197,6 +201,11 @@ python script.py
197
201
198
202
You should see output showing the status code (200 for success) and the response containing the URL of your new visualization. Visit that URL to see your programmatically-created visualization!
Copy file name to clipboardExpand all lines: docs/tutorials/display-tool.md
+10-4Lines changed: 10 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -24,8 +24,6 @@ Before starting, ensure you have:
24
24
25
25
In your IDE or development environment make sure to [start the HoloViz MCP server](getting-started.md/#start-the-server).
26
26
27
-
The open the *Display Server Feed* at http://localhost:5005/feed
28
-
29
27
!!! note
30
28
If the [Display Server](display-server.md) is already running separately, please stop it using CTRL+C. The MCP server will automatically start the Display Server.
31
29
@@ -45,13 +43,15 @@ Your AI assistant will use the `holoviz_display` tool and respond with something
- An interactive bar chart showing the count of each penguin species
54
52
53
+

54
+
55
55
!!! success "Checkpoint"
56
56
If you see the species distribution in your browser, you've successfully created your first visualization! The chart should be interactive - try hovering over the bars.
57
57
@@ -70,6 +70,8 @@ The AI will create a new visualization. Click the new URL to see:
Each visualization gets its own unique URL that you can bookmark or share. The `holoviz_display` tool handles different chart types automatically based on your natural language request.
75
77
@@ -95,7 +97,7 @@ This demonstrates how `holoviz_display` can handle multi-step analytical workflo
95
97
Now let's see all your visualizations together. In your browser, navigate to:
96
98
97
99
```
98
-
http://127.0.0.1:5005/feed
100
+
http://localhost:5005/feed
99
101
```
100
102
101
103
You should see:
@@ -104,6 +106,8 @@ You should see:
104
106
- Creation timestamps
105
107
- "Full Screen" and "Copy Code" buttons for each
106
108
109
+

110
+
107
111
The Feed page automatically updates when new visualizations are created!
108
112
109
113
### Refine Results
@@ -136,6 +140,8 @@ The visualization will include:
136
140
- Plots that update automatically when you change widget values
You've created an interactive dashboard! Behind the scenes, the tool uses Panel's execution methods to enable full applications with reactive components.
0 commit comments