Skip to main content
SimilarExport ZIP
100%

Viz T13

✓ Published0🌍 Public
SSebastian Rojas
Last edited Sep 28, 2021
Created on Sep 24, 2021

This example presents social media post performance, plotting comments against dates while encoding network and likes through color and size. A second chart shows average likes over time, colored by sentiment, using the Vega-Lite API with the d3.csv loader to fetch the PostPerformance dataset. The visualization applies custom axis and label styling from a config object, with line marks for trends and point marks for individual posts, rendered as SVG.

AI-generated description

A visualization constructed using the vega-lite-api.

MIT Licensed

Similar vizzes

Loading thumbnail…

Viz T13 (postperformance)

This example uses the Vega-Lite API with D3 to visualize social media engagement data from a CSV file, showing the relationship between posting dates and sentiment. The first chart plots circles for individual posts, encoding date on the x-axis, network on the y-axis, sentiment by color, and likes by circle size. A second chart displays lines tracking average likes over time, grouped by sentiment. The code demonstrates loading data via D3’s `csv` function and rendering charts with Vega-Lite’s markPoint and markLine encodings, using vega-tooltip for interactivity.

HHiImSebastian
92% match
Loading thumbnail…

Viz T13

This example visualizes social media post performance with an interactive scatterplot of likes versus date, colored and sized by engagements. A linked brush below the chart filters the main view by date range. It is built with Vega-Lite API and D3 v5, loading CSV data from a GitHub gist. The visualization uses interval selection, tooltips, and configurable axis styling for readability.

SSebans31
91% match
Loading thumbnail…

Fork of Viz T13

A fork of a Vega-Lite visualization example, this chart displays social media post performance over time, filtering data by network (Twitter, Facebook, Instagram) and allowing interactive brushing of the date axis to explore the relationship between likes and engagement metrics. The main view uses colored bars to encode the `activity` field, while a secondary bar chart serves as a brush selector for the time range. Built with the vega-lite-api and D3.js (d3.v5), it loads CSV data from a GitHub gist, applies a custom color scale for `activity`, and includes tooltips for additional metrics like duration and engagements.

SSebastian Rojas
82% match
Loading thumbnail…

Fork of HTML Starter

This example visualizes social media post data from a CSV file, plotting points by date and number of comments, with color encoding by network and size by likes. A second chart is defined to show average likes over time colored by sentiment, though it is not rendered. The visualization uses Vega-Lite's JavaScript API and D3 for data loading, with the VEGA and VEGA-LITE libraries registered for rendering to SVG. The chart includes tooltips and custom axis styling for improved readability.

SSebastian Rojas
81% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays a scatter plot of social media data, mapping the day and month on the x-axis, network on the y-axis, sentiment as color, and likes as point size. It uses the vega-lite-api to construct the chart, which is then rendered with vega and vega-lite, with vega-tooltip providing interactivity. The data is loaded as CSV from a gist using d3.csv, and the chart automatically fits the browser window.

HHiImSebastian
78% match
Loading thumbnail…

Vega-Lite API Template

This example demonstrates a Vega-Lite API template that displays a bar chart comparing Facebook usage and internet penetration across countries. The visualization encodes the Facebook date on the x-axis, internet users on the y-axis, and internet penetration as color, with tooltips showing country names. The code uses the vega-lite-api library with Vega, Vega-Lite, and d3.csv for data loading. Custom configuration enhances readability with larger font sizes and a dark color scheme, while the chart automatically fits the browser window dimensions.

RRoma
71% match
Loading thumbnail…

testing stuff

This visualization maps social leaders by department over time, plotting each individual as a semi-transparent circle with a tooltip showing their name. The scatterplot uses Vega-Lite’s API with D3.js to fetch CSV data from a REST endpoint, then renders circles sized and colored consistently across a time axis sorted in descending order. The chart relies on Vega-Lite’s mark encoding for positioning and tooltips, while D3 handles data loading and the Vega runtime manages SVG rendering and interactive tooltip behavior.

AAnidiamDEV
70% match
Loading thumbnail…

Plot of freecodecamp facebook posts reach vs. reaction

This scatterplot visualizes FreeCodeCamp Facebook posts, plotting reactions against reach on logarithmic scales to improve data spread and readability. Tooltips reveal post titles on hover. The visualization is built using Vega-Lite API, with Vega and D3.js handling rendering, and Vega-Tooltip for interactive hover details. Data is fetched from a GitHub-hosted CSV file, and appearance is customized through a shared config object for axis styling and label sizes.

CCurran Kelleher
70% match