Semantic Arts Dataset Ontology II

100%

Semantic Arts Dataset Ontology II

✓ Published0🌍 Public

Last edited Mar 26, 2017

Created on Mar 26, 2017

This visualization displays the SemanticArts dataset ontology as a forest of distinct sunburst diagrams, each representing a top-level class hierarchy. It uses D3.js v3 with an SVG renderer and a zoom behavior that scales and translates the entire layout, while labels scale inversely and fade out based on a level-of-detail threshold. The code applies a D3 partition layout with custom angular and radial size mappings, colors each tree by its root using `d3.scale.category20`, and loads hierarchical data from `tree.json`.

AI-generated description

This visualization shows the ontology of a dataset of SemanticArts. It's a variant of the previous one because it represents the trees of a forest as distinct sunbursts.

forked from <a href='http://bl.ocks.org/fabiovalse/'>fabiovalse</a>'s block: <a href='http://bl.ocks.org/fabiovalse/61722d866b22354e570e'>Semantic Arts Dataset Ontology II</a>

mit Licensed

Similar vizzes

Loading thumbnail…

d3 zoomable sunburst

This example visualizes a hierarchical dataset of plant classifications, organizing species into a zoomable sunburst layout that displays taxonomic relationships from kingdom down to species. Users can click on arcs to zoom into deeper levels of the hierarchy. The visualization uses d3.v5, leveraging the d3.partition and d3.hierarchy APIs to compute the sunburst layout and render it as SVG paths. The data consists of plant entries with taxonomic fields, which are transformed into a nested tree structure for display.

Aatree-rohit

77% match

Loading thumbnail…

Zoomable Sunburst with Labels

This interactive sunburst chart displays hierarchical data with arc labels, allowing users to click any arc to zoom into that subtree, click the center circle to zoom out, or click the canvas to reset. The visualization uses a D3.js v4 partition layout with linear and square-root scales, rendering SVG paths and text elements. It employs `d3.hierarchy`, `d3.arc`, and animated transitions via `transition.attrTween`, while labels are positioned along the arcs using `textPath` elements. The data comes from a JSON file of the Flare dataset, and text is hidden when it does not fit within an arc segment.

TThanaporn-sk

75% match

Loading thumbnail…

Art tree

This visualization is an artful "tree" diagram that displays the hierarchical structure of world geography, from continents down to individual countries. The tree layout is rendered as an SVG with paths and text labels, using a custom font and text-shadow effects to create a visually rich presentation. The code leverages D3 v5 functions including `tree`, `hierarchy`, `linkHorizontal`, and `zoom` to compute positions and enable interactive pan and zoom. The data, sourced from a JSON file, contains nested geographic regions and nation names, which are displayed as text at varying font sizes based on depth.

Fforeverworld1879

74% match

Loading thumbnail…

zoomable sunburst with sunlight colors

This zoomable sunburst diagram displays hierarchical data with arc labels, using the Flare dataset. Clicking an arc zooms into that subtree, the center circle zooms back out, and the background resets the view. The visualization uses D3 v4’s `d3.partition`, `d3.arc`, and `d3.scaleOrdinal` with a 30-color palette from the Sunlight Foundation Style Guide. Labels render along curved paths via `d3.path` and `textPath`, with animated transitions driven by `transition.attrTween` and interpolated scales. A white contour stroke improves label readability.

FFrissAnalytics

74% match

Loading thumbnail…

D3 v5 Zoomable Sunburst

This zoomable sunburst diagram visualizes the hierarchical structure of the Flare dataset, with nested arcs representing categories and subcategories. Clicking a node smoothly zooms and re-centers the view on that segment, while fading out irrelevant arcs and labels. Built with D3 v5, it uses `d3.partition`, `d3.hierarchy`, and `d3.arc` to compute the layout, and `transition.attrTween` for animated interpolation between states. Data loads via the Observable standard library, with SVG rendering and a rainbow color scale for top-level branches.

JJ. Matthew Pryor

74% match

Loading thumbnail…

D3 v5 Zoomable Sunburst

This interactive sunburst visualization displays a hierarchical dataset from the Observable “flare” library. The circular treemap partitions data by category and subcategory, with each arc’s size reflecting the value. Clicking an arc smoothly zooms to that node, re-centering the layout and fading out unrelated segments, using `d3.hierarchy`, `d3.partition`, and `d3.arc` for geometry and `transition.attrTween` for animation. The SVG output is styled with `d3.scaleOrdinal` and `d3.interpolateRainbow` for color, while labels and tooltips are generated via D3 selections.

Ccochis

74% match

Loading thumbnail…

D3 v5 Zoomable Sunburst

This D3 v5 zoomable sunburst visualizes a hierarchical dataset, using colored arcs to represent nested categories from the flare data loaded via the Observable standard library. Clicking an arc animates a zoom into that node, with transitions driven by `d3.arc` interpolation and `transition.attrTween` to smoothly reshape arcs and labels. The SVG rendering uses `d3.partition`, `d3.hierarchy`, and ordinal color scales, with visibility logic filtering arcs and text based on computed angular and radial bounds.

SShivrangi

73% match

Loading thumbnail…

D3 v5 Zoomable Sunburst

A zoomable sunburst visualization displays hierarchical data from the Flare dataset, with each ring segment representing a category and its value. The visualization uses D3 v5's partition layout to render the tree structure as an interactive SVG, allowing users to click on any arc to zoom into that branch. The code builds the sunburst from a JSON file using d3.partition and d3.hierarchy, with the root node always visible at the center. The implementation is ported from an Observable notebook and uses the D3.js library with the SVG rendering approach.

Ccmsodi

73% match