This page demonstrates the key features of LineChart plots in JSPlots.
Basic time series: Simple line chart with date axis
Multiple series: Comparing multiple lines with color dimension
Interactive filters: Dropdown menus to filter data dynamically
Dynamic controls: Change color, aggregation, and faceting on the fly
Aggregation: Handle multiple observations per x value
Faceting: Facet wrap (1 variable) and facet grid (2 variables)
Integration: Combining charts with images and text
Daily Revenue Trend - H1 2024
Basic time series showing 6-month revenue trend
Plot Attributes
Data: revenue_data
Monthly Sales Comparison Across Years
Multiple series chart demonstrating color dimension to compare years
Plot Attributes
Data: sales_data
Department Productivity by Month
Interactive filters allow you to select different departments and quarters
Filters
Plot Attributes
Data: metrics
example_visual
Example visualization image
images.jpeg
Sales by Product (Facet Wrap)
Facet wrap creates a grid of subplots, one for each product. Similar to ggplot2's facet_wrap.
Plot Attributes
Faceting
Data: facet_data
Sales by Product and Region (Facet Grid)
Facet grid creates a 2D grid of subplots. First facet variable (Product) defines rows, second (Region) defines columns. Similar to ggplot2's facet_grid.
Plot Attributes
Faceting
Data: facet_grid_data
Dynamic Controls Demo - Stock Returns
Use the dropdown menus to dynamically change: (1) Color by, (2) Line type by, (3) Aggregator, (4) Facet 1, (5) Facet 2.
Plot Attributes
Faceting
Data: dynamic_data
Aggregation Demo - Multiple Observations per X
This dataset has 5 observations per month. Use the Aggregator dropdown to switch between: none (all points), mean, median, count, min, max.
Plot Attributes
Data: agg_data
Multi-Dimensional Weather Data - Dynamic X and Y Selection
Use the dropdowns to dynamically switch between different time scales (X) and measurements (Y). This demonstrates how you can provide multiple options for both axes and let users explore different views of the same dataset.
Plot Attributes
Data: multi_data
Sales with Continuous Range Filters
This example demonstrates jQuery UI range sliders for continuous variables. Use the Product dropdown for categorical filtering, and the Profit Margin and Units sliders to filter by numeric ranges. Each slider has two handles for min/max values.
Filters
122.16 - 999.08
5.28 - 49.48
Plot Attributes
Data: continuous_filter_data
Key Features Summary
Dynamic X and Y dimensions: Choose which variables to plot on X and Y axes from dropdowns
Time series support: Automatic date formatting and axis scaling
Dynamic color grouping: Choose which variable to color by from dropdown
Aggregation: Handle multiple observations per x value with mean, median, count, min, max, or none
Interactive filters: Dropdown menus for categorical filtering and jQuery UI range sliders for continuous numeric filtering
Continuous range sliders: Single slider bar with two draggable handles for min/max values (powered by jQuery UI)
Dynamic faceting: Choose 0, 1, or 2 variables for faceting on the fly
Customization: Control titles, labels, line width, and markers
Integration: Combine with other plot types, images, and text
