Skip to main content
100%

Keshif Browser Configuration

✓ Published0🌍 Public
Aadilyalcin
Last edited Mar 6, 2017
Created on Mar 6, 2017

This visualization presents nutritional data for 77 cereals using the Keshif browser configuration, displaying summaries across left, right, and middle panels. It shows categorical fields like Brand, Type, and Shelf Level alongside quantitative measures such as Sodium, Fiber, Potassium, Calories, Protein, and Rating, with percentile indicators and collapsible sections. The record display uses a scatter plot view sorting by Rating and plotting Potassium, with text search on cereal names. Data loads from a Google Sheets document via the configuration’s source URL, while the interface relies on Keshif’s built-in rendering, which internally uses D3.js for layout and interactions.

AI-generated description

Similar vizzes

Loading thumbnail…

Keshif Browser Configuration

Keshif Browser Configuration displays city data from a Google Spreadsheet in a faceted browsing interface, with state names summarized on the left panel and numerical indicators like Culture Score Index, PctOver65, Pleasant Days Mean, Crime Rate, and Cost of Housing on the right. The Keshif library renders a sortable list of cities with text search, using interval-based summaries for sorting options. Configuration via kshf_config.json specifies panel widths, record views, and a ready callback that dynamically adds sorting controls to the browser.

Aadilyalcin
75% match
Loading thumbnail…

Keshif Browser Configuration

The Keshif Browser Configuration example visualizes a dataset of data breaches, showing a faceted summary of records by industry with an interactive left-side panel for filtering. It displays the distribution of breaches across industries while hiding other categorical and temporal summaries from view. The code loads data from a Google Sheet via a gdocId reference and configures the Keshif library’s `summaries` array to specify panel placement, including an intervalScale for time-based data. It relies on Keshif’s built-in aggregation and rendering, with explicit label widths and a record name for the dataset.

Aadilyalcin
74% match
Loading thumbnail…

Keshif Browser Configuration

Keshif Browser Configuration presents a dataset of music singles through an interactive faceted browser. The visualization displays each record as a list item in the middle panel, showing the artist and track name, while seven categorical summaries (Genre, Label, Country, Sex, Age, Type, Race) are arranged in left and right side panels for filtering. The interface uses Keshif’s configuration API, loading data from a Google Spreadsheet via a `gdocId`, and defines record rendering with a custom function that concatenates artist and track fields. The `kshf_config.json` file specifies panel widths, text search, and a zoom-based details toggle, while `kshf_style.css` sets the container dimensions to 890 by 480 pixels.

Aadilyalcin
73% match
Loading thumbnail…

Keshif Browser Configuration

Keshif Browser Configuration displays a ranked list of music singles, showing each record as an artist-track pair with a position number. The visualization splits categorical summaries of Genre and Label on the left, while Country, Sex, Age, Type, and Race appear on the right, all sourced from a Google Spreadsheet. It uses the Keshif library to render interactive facet panels and a sortable list, with a zoom-to-details interaction. The custom CSS fixes the demo container to 890 by 480 pixels, and the configuration sets panel label widths and a text search field for filtering.

Aadilyalcin
73% match
Loading thumbnail…

Keshif Browser Configuration

This interactive browser of academic papers uses Keshif to display a searchable, filterable collection from a Google Spreadsheet, with papers listed in the center and summaries of Venue, Type, Citations, Affiliation, Authors, and Year in side panels. The interface lets users filter by these facets and shows each paper’s title, type, venue, year, DOI link, authors, and abstract. The configuration uses Keshif’s API with custom JavaScript functions in `loadedCb` and `recordView` to process citation data and render records, while CSS styles the paper cards and colored type badges.

Aadilyalcin
71% match
Loading thumbnail…

Keshif Browser Configuration

This example uses the Keshif library to build an interactive browser for Maryland sewer overflow reports from 2004-2016, sourced from data.maryland.gov. It displays summary panels for categorical attributes like overflow type, cause, duration, zip code, county, and municipality, alongside a time-based date filter. The configuration defines custom JavaScript functions to parse raw fields, including converting duration values into human-readable buckets and formatting dates with Moment.js. Records are listed with sortable columns, and a zoom toggle expands details for individual entries.

Aadilyalcin
70% match
Loading thumbnail…

Cereal Dataset

This visualization presents a summary of cereal nutritional data loaded from a local CSV file, including row and column counts, a preview table of the first ten entries, and a bar chart ranking the top ten cereals by rating. Built with D3 v7, the chart uses `d3.scaleBand` and `d3.scaleLinear` to map cereal names and ratings to SVG rectangles, with axes and hover tooltips via appended `title` elements. The page also incorporates simple decorative SVG shapes depicting a cereal bowl and a phone.

Rrajivkarri98@gmail.com
69% match
Loading thumbnail…

Visualization

This zoomable scatterplot visualizes nutritional data for 77 breakfast cereals from a CSV file, encoding each cereal as a circle positioned by calories and protein, with size reflecting sodium content. The SVG-based chart uses d3.v3 and animates smoothly on zoom, letting viewers pan and scale to explore the distribution of cereal brands by manufacturer. Built as a D3.js example, it adapts zoom behavior from earlier scatterplot blocks, rendering the data as an interactive, animated graphic.

GGerardoFurtado
69% match