Skip to main content
100%

Gist fd2387f597641c4a52a7

✓ Published0🌍 Public
Aandybak
Last edited Sep 15, 2014
Created on Sep 15, 2014

This visualization displays the movement of consignments over time, plotting each item’s journey from start to end location based on timestamps. The code queries logistics data with Django ORM, filtering out consignments linked to bookings with a specific status, then renders the results as a temporal flow. It uses D3.js’s `d3.forceSimulation` to position nodes representing locations and consignments, while `transition.attrTween` animates the paths between them. The rendering approach relies on SVG elements, with the data sourced from a PostgreSQL database via the raw SQL query shown.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist c99a8e7213158cfd1ec8

The visualization tracks consignment movements by filtering query sets for departures from and arrivals at base locations, distinguishing deliveries, collections, and items in transit. It shows the flow of goods between origins and destinations, with transit defined as the union of completed deliveries and collections. The code relies on Django’s queryset API with `Q` objects for location-based filtering, using `exclude` to isolate timed events, and combines results via set union. No specific charting library appears; the rendering approach is not visible in this snippet, focusing instead on data preparation.

Aandybak
84% match
Loading thumbnail…

Gist 9514739

This visualization displays hire volume as an aggregate sum of booking stock quantities over time, using a bar-chart template sized at 580x200 pixels. The chart draws from a Django queryset of BookingStockItem records, filtering by the estimated dispatch date field and aggregating quantities with Django’s `Sum` function. The data is rendered on a daily interval, and the chart class extends a custom `BaseChart` with a title and chart template. The implementation relies on Django’s ORM for data retrieval and aggregation, with the visualization output presumably using a charting library within the specified template, though the code snippet does not expose the exact front-end rendering library.

Aandybak
70% match
Loading thumbnail…

Gist 9839271

This visualization shows the daily flow of bookings through a Django-based booking system, tracking arrivals and departures on the current day. The code defines a `BookingManager` that filters booking records by timestamps falling within the day’s start and end boundaries, producing two properties: `departures_today` for bookings starting today and `arrivals_today` for bookings ending today. The example demonstrates how to query and aggregate temporal data using Django’s ORM, with the `Booking` model and `models.Manager` class providing the data structure. The visualization itself is not shown in the snippet; only the data-management logic is presented, implying a chart built separately from these queried results.

Aandybak
68% match
Loading thumbnail…

Gist 8a97689739c217f28474d80c89013628

This visualization uses a force-directed graph to show relationships between entities, with nodes positioned by `d3.forceSimulation` and links drawn as curved paths. The code computes node sizes and colors from quantitative attributes, while a canvas overlay via `d3.geoPath` and `getImageData` samples pixel density to modulate link opacity based on local clustering. It employs a custom `transition.attrTween` to animate node drift when the simulation restarts, and uses the `d3.hierarchy` API to flatten nested data from a JSON file. The visualization reads credentials from an `env.list` file for a private data source, but the rendering logic is independent of that authentication step.

CConorAspell
68% match
Loading thumbnail…

Gist f8797295d3575bca4ec2c444e035e8bb

The visualization is a line chart showing a sequence of data points, rendered as a single continuous path. The line is drawn using SVG path data with a red stroke, positioned against a plain background with minimal styling. It appears to be a simple time-series or sequence plot, where the path connects coordinates across a fixed horizontal axis, with the line rising and falling as it progresses from left to right. The chart uses no axes, gridlines, or labels, suggesting a minimalist or abstract presentation of the data.

Aandybak
68% match
Loading thumbnail…

Gist 82e79cc1588db5bfaa80d319795eb99a

The visualization plots a list of charity fundraising events, each represented as a point positioned along a timeline based on its scheduled date. The code uses `d3.forceSimulation` to lay out the points, with the x-axis encoding time and the y-axis using a force to avoid label overlap. Event titles are displayed as text labels, and the dataset comes from a plain-text file containing event names and dates. The rendering relies on standard SVG elements created via D3 selections, with no additional charting library.

Aandybak
66% match
Loading thumbnail…

Gist 6112837

This example visualizes the 2008 cohort of vehicle test records from a gist, mapping individual vehicles as nodes in a force-directed network. The visualization uses d3.forceSimulation to compute node positions based on shared attributes like make and fuel type, while d3.geoPath renders a geographic backdrop for postcode regions. Canvas getImageData samples pixel colors for a density heatmap overlay, and transition.attrTween animates node movements during filtering. The schema.ini file defines the pipe-delimited data structure, and the code reads the CSV directly from the gist to drive the interactive layout.

IIanHopkinson
66% match
Loading thumbnail…

Gist 11145951

This visualization uses a force-directed simulation with D3’s `d3.forceSimulation` to arrange a network of linked nodes. The code loads external data (likely from a JSON or CSV file) and renders the graph as an interactive SVG, with node positions updated continuously through the simulation’s tick events. Links are drawn as simple lines, while nodes appear as colored circles, and the layout responds to mouse interactions for dragging. The example also includes a footer with social media icons, but the core graphic focuses on the dynamic network structure.

Aandybak
66% match