See here for the example code that generated this page

Path Chart Examples

This page demonstrates the key features of Path charts in JSPlots.

Trajectory visualization: Show evolution of metrics over time or sequence
Direction indicators: Arrows or alpha gradients indicating path direction
Multiple paths: Compare different entities with color grouping
Interactive dimensions: Swap x and y axes dynamically from the HTML
Faceting: Facet wrap (1 variable) and facet grid (2 variables)
Order control: Connect points according to any ordering column

Trading Strategy Evolution (2015-2024) - With Arrows

Arrows show the direction of evolution over time. Swap dimensions using dropdowns.

Plot Attributes

X dimension:

Y dimension:

Data: strategy_data

Trading Strategy Evolution (2015-2024) - With Alpha Gradient

Transparency gradient from 0.3 (early years) to 1.0 (recent years) shows direction without arrows.

Plot Attributes

X dimension:

Y dimension:

Data: strategy_data

Regional Strategy Analysis (2015-2024)

Default shows 3 strategies in US region. Use filters to explore other regions. Alpha gradient shows time progression.

Filters

region:

Plot Attributes

X dimension:

Y dimension:

Path grouping:

Data: regional_data

Asset Class Risk-Return Evolution (2016-2024)

Three major asset classes. Notice how bonds have lower volatility but also lower returns. Alpha gradient shows recent years are bolder.

Plot Attributes

X dimension:

Y dimension:

Data: asset_data

Strategy Performance by Region (Faceted)

Each panel shows one region with 3 strategies. Faceting allows clear comparison across regions. Arrows show direction.

Plot Attributes

X dimension:

Y dimension:

Faceting

Facet 1:

Facet 2:

Data: regional_data

Product Development Lifecycle (12 Quarters)

Track how products evolved. Combining arrows AND alpha gradient for maximum clarity.

Plot Attributes

X dimension:

Y dimension:

Data: product_data

Portfolio Optimization Journey (30 Iterations)

30 iterations of optimization. Alpha gradient shows progression from initial (faint) to final (bold).

Plot Attributes

X dimension:

Y dimension:

Data: optimization_data

Business Metrics Evolution (24 Months)

Path ordered by date. Both arrows and alpha gradient enabled for clear directional visualization.

Plot Attributes

X dimension:

Y dimension:

Data: business_data

This page was created using JSPlots.jl v0.3.1.