Gist 6aa3450d9b856251aaedccbfbb552622

100%

Gist 6aa3450d9b856251aaedccbfbb552622

✓ Published0🌍 Public

Last edited Jun 8, 2017

Created on Jun 8, 2017

This visualization generates two concentric, spiral-like polylines from tabular data, with each line tracing a sequence of points along a circular path. The first series sweeps through a wide angular range, while the second covers a narrower band, creating a layered, oscillating pattern. The rendering relies on Power Query’s `#table` constructor to build the dataset and a custom `List.Accumulate` function to compute each point’s coordinates based on a category, step count, and angular start/end values. The resulting shape emphasizes the geometric relationship between the two angular intervals, showing how a simple parametric function can produce a visually rhythmic composition.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist f7ddd40cd326e033f91e1a433eeed7b9

This example plots a parametric curve of Mickey Mouse’s head and ears using a Fourier-style sum of sine waves. The visualization shows the iconic silhouette generated from 100 points, each computed via two long trigonometric expressions for the x and y coordinates. The code uses Power Query’s `Table` and `List.Accumulate` to generate the point table, while the actual plotting relies on DAX table expressions that define the coordinate formulas. The rendering approach is implicit, with the curve drawn as a continuous line from the calculated points, and the source data is purely synthetic, created from the mathematical functions rather than external data.

HHugoberry

72% match

Loading thumbnail…

Gist bb8fddc4a5fc3cc60c99

A line chart maps a small array of ten numbers to an SVG path, showing how the values fluctuate across a linear sequence. The visualization uses a red, unbroken polyline to emphasize the shape of the data, with the y-axis scaled from the data’s minimum to maximum and the x-axis evenly spaced by index. The code creates the chart using d3.scale.linear for both axes and d3.svg.line to generate the path, which is appended to an SVG container via d3.select and datum. The fixed width and height of 500 pixels define the plotting area, while the stroke and fill styles come from a CSS class.

CCaged

71% match

Loading thumbnail…

Gist 4d1f4b4dc3b5e7c1353bd9ae3059b33a

This example visualizes a parametric curve in the shape of a fish, plotted from 100 discrete points. The code computes the x and y coordinates using trigonometric functions—x as `2*(cos(t) - (sin(t)^2)/sqrt(2))` and y as `2*sin(t)*cos(t)`—over a range of t from 0 to 2π. The data is generated in Power Query M, with the `Fish.M` table using `List.Accumulate` to create the point indices, while the DAX measures `Fish.dax xt` and `yt` supply the coordinate formulas. The rendering relies on the table’s `#table` constructor, though the drawing itself is not shown in the gist, focusing instead on the data preparation and coordinate transformation.

HHugoberry

70% match

Loading thumbnail…

Gist ba3a80c35942582d77235e9fb4173416

This example shows a small, inline sparkline generated as a Scalable Vector Graphic (SVG) image URL from a Power BI measure. It plots a measure’s values over time for a single category, mapping each date to an X coordinate and each value to a Y coordinate within a 100×100 viewBox. The code uses DAX variables like `MINX`, `MAXX`, and `SUMMARIZE` to compute the normalized coordinates, then concatenates them into a `polyline` string. The result is rendered as a data URI with `data:image/svg+xml;utf8`, relying on the table’s `Date` and `Category` fields.

HHugoberry

70% match

Loading thumbnail…

Gist 8bb4970e2700b40a3dce1d785654d907

This visualization uses a force-directed graph to map the relationships between identifiers extracted from a Power Query M codebase. The data originates from a gist by Hugoberry, showing dependencies among functions, modules, and error-handling patterns. The rendering relies on D3.js’s `forceSimulation` with custom link and node positioning, while each node’s label is drawn using SVG text. The code specifically highlights groupings like `TableAction.*`, `ValueAction.*`, and `Pattern.*`, revealing hierarchical clusters of related API calls. The graph’s layout is animated via D3’s tick handler, and the visible node sizes suggest a metric like degree centrality, though the exact encoding is not explicit in the snippet.

HHugoberry

69% match

Loading thumbnail…

Gist 890029

This visualization maps the timestamps of Gist 890029 commits as a radial time-series layout, showing activity across days of the week and hours. It uses d3.forceSimulation to position circular nodes on a spiral, with each point encoded by day and time. The rendering relies on d3.quadtree for collision detection and a custom path generator via d3.curveLinear, while axis labels and tick marks are drawn using d3.axisTop and d3.axisLeft. The source data comes from the gist’s file list, where each line is a timestamp parsed into a Date object. Color intensity varies by frequency, and the visualization highlights daily rhythms through a stacked circular band.

CCaged

69% match

Loading thumbnail…

Gist ec930412e72d913bffbb04219457e593

A single, continuous polyline forms a zigzag pattern across the SVG viewport, alternating between the top and bottom edges. The line, defined by a single `polyline` element, uses coordinates that increment horizontally by roughly 9.7 units, creating a regular sawtooth wave. The rendering relies on raw SVG, with the polyline’s points explicitly listed in the markup. The visualization demonstrates a minimal, purely geometric data trace, showing how a sequence of values can be encoded as alternating high and low positions. No external libraries are used; the example relies on the native SVG polyline API.

EEelsie

69% match

Loading thumbnail…

Circular Geometric Patterns

The visualization displays a grid of circular geometric patterns formed by connecting points on a virtual circle. Based on the Vedic Square concept, each cell plots lines between nodes using varying skip factors and node counts, with thin orange strokes over light gray circles on a muted background. Built with React and D3 v5, it uses the `range()` and `line()` APIs with `curveLinearClosed` to generate star-like polylines, while SVG `<circle>` elements are rendered per node. A CSS blur filter softens the overall appearance.

Ssofia-martinovich

67% match