fengliplatform

@fengliplatform·8 public vizzes

task4

This horizontal bar chart displays the 30 most frequently mentioned Italian dishes, with counts ranging from over 1,600 mentions of olive oil down to 166 for olive garden. The visualization uses d3.csv to load the data, d3.scaleLinear for the x-axis, d3.scaleBand for the categorical y-axis, and renders SVG rectangles colored steelblue via the d3-selection API. Axis labels and a title are added using d3.axisBottom, d3.axisLeft, and SVG text elements, with count values formatted using d3.format.

Jul 11, 2021

Loading thumbnail…

task5

This visualization shows the top ten populous countries or restaurants ranked by review stars, displaying horizontal bars for each entry in descending order. The data comes from a CSV file listing restaurants with their average star ratings, rendered as an SVG bar chart using D3 v5. The code uses `scaleLinear` for the x-axis star values, `scaleBand` for the categorical y-axis restaurant names, and `axisLeft`/`axisBottom` for the axes. Bar heights and widths are computed from the data, with a labeled title and axis text styled via CSS.

Jul 11, 2021

Loading thumbnail…

task1.1 v2

A radial tree visualization displays hierarchical topic clusters, with root categories branching into individual leaf nodes such as terms and phrases. The visualization uses D3 v4’s `d3.cluster` layout and renders SVG text and path elements. Panning and zooming are enabled via `d3.zoom`, with node font size scaled by depth using `d3.scaleSqrt`. Data is loaded from a local JSON file.

May 26, 2021

Loading thumbnail…

task1.2

A radial tree visualization displays a hierarchical structure of topics and keywords associated with the restaurant "Mon Ami Gabi," with "Positive Topics" branching into multiple "topic" nodes and their corresponding leaf terms. The SVG rendering, built with D3 v4, uses `d3.cluster` to position nodes in a circular layout, with text labels scaled by depth and rotated for readability. Panning and zooming are implemented via D3's `d3.zoom` behavior, while curved links connect parent and child nodes.

May 26, 2021

Loading thumbnail…

task1.1

This radial tree visualization displays a hierarchical topic structure, with the root "Topics" branching into four main topics, each containing fifteen associated terms. The D3 v4 code uses `d3.cluster()` to compute the layout and projects nodes onto a circular coordinate system. Text labels rotate based on their angular position, while depth-dependent font sizes and edge curvature distinguish hierarchy levels. The SVG rendering includes pan and zoom functionality via `d3.zoom()`, applied to a background rectangle that captures pointer events.

May 26, 2021

Loading thumbnail…

task 1.2 v2

This radial tree visualizes a hierarchical dataset of customer review topics for a restaurant, with the root labeled "Mon Ami Gabi" and branches for positive topics and individual keywords. The code uses D3 v4’s `d3.cluster` layout and `d3.zoom` to enable panning and zooming of the SVG rendering. Nodes are positioned radially, with leaf labels rotated and anchored to avoid overlap. Curved links connect parent and child nodes, and font size scales with depth via `d3.scaleSqrt`.

May 26, 2021

Loading thumbnail…

Fork of ILINet Flu Surveillance Data

This line chart displays annual U.S. ILI (influenza-like illness) total cases across weeks, with one multi-segment line per year from 2015 to 2019. The visualization aggregates weekly ILITOTAL values by year and region, using an unordered color scale for the year field, which complicates comparison. It is built with vega-lite-api, which wraps D3 v5 and Vega-Lite, loading CSV data from the CDC FluView Interactive via d3.csv. The chart uses tooltips to show year values on hover, and the code sets axis styling through a custom config object.

May 25, 2021

Loading thumbnail…

Fork of HTML Starter

This example displays a centered, large-scale "Hello HTML" message on a plain web page, with a hidden console greeting triggered on load. The code uses basic HTML structure, embedded CSS for styling, and vanilla JavaScript via the `console.log` API. The page demonstrates a minimal setup for rendering static text and executing a simple script, serving as a foundation for more complex visualization projects.

May 25, 2021