Skip to main content
SimilarExport ZIP
100%

Agent Performance over Time in Walker

✓ Published0🌍 Public
CChrisKort
Last edited Oct 28, 2019
Created on Oct 27, 2019

This example visualizes the performance of a VPG (Vanilla Policy Gradient) agent over time in the Walker environment, plotting average episode return against interaction count. The code uses D3 v5 APIs to create an SVG line chart with a basis-curved line path, styled axes with tick marks and labels, and a title. Data is loaded from a remote CSV and processed for numerical fields before rendering.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Agent Performance over Time in Walker

This visualization shows the performance of a Vanilla Policy Gradient (VPG) agent in the Walker environment over time, plotting performance against the number of interactions on a line chart. The chart includes axes with tick marks, axis labels, and a title, all rendered as SVG using D3 v5. The code uses `d3.csv` to load data from a VizHub-hosted dataset, `d3.scaleLinear` for both x and y axes, and `d3.line` with `curveBasis` to draw the smoothed line path. Data is parsed from CSV strings to numbers before rendering.

CChrisKort
96% match
Loading thumbnail…

Let's make a face with D3.js!

This line chart shows the performance of the VPG reinforcement learning algorithm in the Walker environment over time, plotting average episode return against the number of interactions. The visualization is rendered as an SVG using D3.js v5, with the `scaleLinear`, `axisLeft`, and `axisBottom` functions for the axes, and the `line` function with `curveBasis` to create the smoothed data path. Data is loaded from a remote CSV via `d3.csv` and styled with custom CSS for labels and title.

CChrisKort
80% match
Loading thumbnail…

Untitled

This interactive visualization shows how a deep reinforcement learning agent’s performance evolves over training timesteps, with multiple score series tracking different agents or runs. The chart animates through the training timeline, allowing viewers to compare score trajectories and observe how performance improves over time. Built with D3.js v7, the SVG-based visualization uses a slider to scrub through timesteps and dynamically update the line chart. The data comes from a hardcoded score list, and the page includes tabbed navigation and buttons to switch between overview and detailed views of the training process.

Llloydy8
64% match
Loading thumbnail…

Fork of Customizing Axes

This visualization presents a comparative analysis of player performance in a gaming context, featuring both a bar chart and an interactive scatter plot. The bar chart displays aggregated performance metrics per agent, while the scatter plot allows users to explore correlations between different statistics like kills, deaths, and assists. Users can dynamically switch which metric is displayed on the bar chart and both axes of the scatter plot via dropdown menus. The visualization is built using D3 version 7, leveraging APIs such as `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` to render the SVG elements and manage the interactive updates. The data is loaded from CSV files containing player match statistics.

Ddaniel
61% match
Loading thumbnail…

Time based moving graph

A time-based line chart displays four network performance metrics—Partner, PCL, GOLAN, and DriveU—measured in MBPS over a two-minute period. The visualization animates by smoothly translating the x-axis and line paths leftward, creating the effect of a moving time window. Data is loaded from a CSV file and parsed into JavaScript Date objects. The chart uses D3 v6 scales, axes, line generators with basis curves, ordinal color scales, and clip paths to reveal the moving portion, with a linear transition controlling the animation speed.

PPiotr Paszek
59% match
Loading thumbnail…

VCtAxes

This example presents a two-panel visualization of Valorant Champions Tour player statistics from a CSV dataset. A horizontal bar chart compares performance metrics for different agents, while an animated scatter plot shows the correlation between selected metrics, such as kills, deaths, and assists. Interactive dropdown menus let users switch the metric displayed in the bar chart and choose which variables to plot on the scatter plot's X and Y axes. The visualization uses D3 v7 with ES6 modules, including `scaleLinear`, `scaleBand`, `axisLeft`, `axisBottom`, and `transition().duration()` for the animated circles.

Ddaniel
59% match
Loading thumbnail…

Performance Visualization Dashboard

This dashboard visualizes runtime performance across frames using three coordinated D3 v6 SVG charts. A bar chart shows functions with the longest total runtime, while a scatter plot details the breakdown of the longest frame by function. An interactive line chart connects performance points over tick time, enabling selection of specific frames. The visualization uses d3.csv for data loading, scaleBand, scalePoint, scaleLinear, axisLeft, axisBottom, and d3.timeParse to structure the CSV data containing Tick, Identifier, and Runtime fields.

IINDIGOBLIN
59% match
Loading thumbnail…

Parallel Coordinate Chart

This parallel coordinate chart visualizes player performance metrics across eight dimensions, including distance, sprinting time, and work-to-rest ratio, with each polyline representing an individual player. The D3 v4 code uses `d3.scalePoint` for horizontal axis placement, `d3.scaleLinear` for each vertical dimension, and `d3.brushY` to enable interactive filtering by dragging along any axis. Inactive lines render in light gray while selected regions highlight active paths in blue via CSS classes, with data displayed as static SVG elements.

JJanchorizo
59% match