|
34 | 34 | "metadata": {}, |
35 | 35 | "outputs": [], |
36 | 36 | "source": [ |
37 | | - "# 4D DataArray: metric x year x country x scenario\n", |
| 37 | + "# 4D DataArray: scenario x metric x year x country\n", |
38 | 38 | "df_gap = px.data.gapminder()\n", |
39 | 39 | "countries = [\"United States\", \"China\", \"Germany\", \"Brazil\"]\n", |
40 | 40 | "metrics = [\"lifeExp\", \"gdpPercap\"]\n", |
|
355 | 355 | "metadata": {}, |
356 | 356 | "source": [ |
357 | 357 | "---\n", |
358 | | - "## When to Use What\n", |
| 358 | + "## Summary\n", |
359 | 359 | "\n", |
360 | 360 | "| Method | Static/Faceted | Animated |\n", |
361 | 361 | "|--------|----------------|----------|\n", |
|
365 | 365 | "| `fig.update_traces()` | ✅ | ❌ base only |\n", |
366 | 366 | "| `update_traces(fig, ...)` | ✅ | ✅ all frames |" |
367 | 367 | ] |
368 | | - }, |
369 | | - { |
370 | | - "cell_type": "markdown", |
371 | | - "id": "25", |
372 | | - "metadata": {}, |
373 | | - "source": [ |
374 | | - "---\n", |
375 | | - "## Animation Speed\n", |
376 | | - "\n", |
377 | | - "The API is deeply nested, but straightforward once you know where to look." |
378 | | - ] |
379 | | - }, |
380 | | - { |
381 | | - "cell_type": "code", |
382 | | - "execution_count": null, |
383 | | - "id": "26", |
384 | | - "metadata": {}, |
385 | | - "outputs": [], |
386 | | - "source": [ |
387 | | - "fig = xpx(da.sel(scenario=\"baseline\", metric=\"gdpPercap\")).bar(animation_frame=\"year\")\n", |
388 | | - "\n", |
389 | | - "# Speed up animation\n", |
390 | | - "fig.layout.updatemenus[0].buttons[0].args[1][\"frame\"][\"duration\"] = 200\n", |
391 | | - "fig.layout.updatemenus[0].buttons[0].args[1][\"transition\"][\"duration\"] = 100\n", |
392 | | - "\n", |
393 | | - "fig" |
394 | | - ] |
395 | | - }, |
396 | | - { |
397 | | - "cell_type": "code", |
398 | | - "execution_count": null, |
399 | | - "id": "27", |
400 | | - "metadata": {}, |
401 | | - "outputs": [], |
402 | | - "source": [ |
403 | | - "# Helper function for convenience\n", |
404 | | - "def set_animation_speed(fig, frame_duration=500, transition_duration=300):\n", |
405 | | - " \"\"\"Set animation speed in milliseconds.\"\"\"\n", |
406 | | - " if fig.layout.updatemenus:\n", |
407 | | - " fig.layout.updatemenus[0].buttons[0].args[1][\"frame\"][\"duration\"] = frame_duration\n", |
408 | | - " fig.layout.updatemenus[0].buttons[0].args[1][\"transition\"][\"duration\"] = transition_duration\n", |
409 | | - " return fig" |
410 | | - ] |
411 | | - }, |
412 | | - { |
413 | | - "cell_type": "code", |
414 | | - "execution_count": null, |
415 | | - "id": "28", |
416 | | - "metadata": {}, |
417 | | - "outputs": [], |
418 | | - "source": [ |
419 | | - "fig = xpx(da.sel(scenario=\"baseline\", metric=\"lifeExp\")).line(animation_frame=\"year\")\n", |
420 | | - "set_animation_speed(fig, frame_duration=100, transition_duration=50)\n", |
421 | | - "fig" |
422 | | - ] |
423 | | - }, |
424 | | - { |
425 | | - "cell_type": "markdown", |
426 | | - "id": "29", |
427 | | - "metadata": {}, |
428 | | - "source": [ |
429 | | - "---\n", |
430 | | - "## Slider Styling" |
431 | | - ] |
432 | | - }, |
433 | | - { |
434 | | - "cell_type": "code", |
435 | | - "execution_count": null, |
436 | | - "id": "30", |
437 | | - "metadata": {}, |
438 | | - "outputs": [], |
439 | | - "source": [ |
440 | | - "fig = xpx(da.sel(scenario=\"baseline\", metric=\"gdpPercap\")).bar(animation_frame=\"year\")\n", |
441 | | - "\n", |
442 | | - "# Customize slider\n", |
443 | | - "fig.layout.sliders[0].currentvalue.prefix = \"Year: \"\n", |
444 | | - "fig.layout.sliders[0].currentvalue.font.size = 16\n", |
445 | | - "\n", |
446 | | - "fig" |
447 | | - ] |
448 | | - }, |
449 | | - { |
450 | | - "cell_type": "code", |
451 | | - "execution_count": null, |
452 | | - "id": "31", |
453 | | - "metadata": {}, |
454 | | - "outputs": [], |
455 | | - "source": [ |
456 | | - "# Hide slider (keep play button)\n", |
457 | | - "fig = xpx(da.sel(scenario=\"baseline\", metric=\"gdpPercap\")).bar(animation_frame=\"year\")\n", |
458 | | - "fig.layout.sliders = []\n", |
459 | | - "fig" |
460 | | - ] |
461 | | - }, |
462 | | - { |
463 | | - "cell_type": "markdown", |
464 | | - "id": "32", |
465 | | - "metadata": {}, |
466 | | - "source": [ |
467 | | - "---\n", |
468 | | - "## Summary\n", |
469 | | - "\n", |
470 | | - "- Standard Plotly methods work for layout, axes, and static figures\n", |
471 | | - "- Use `update_traces()` from xarray-plotly for trace properties with animation\n", |
472 | | - "- Animation speed/slider require accessing nested layout properties" |
473 | | - ] |
474 | 368 | } |
475 | 369 | ], |
476 | 370 | "metadata": { |
|
0 commit comments