Skip to main content
SimilarExport ZIP
100%

Shopping Habits

✓ Published1🌍 Public
Mmacgregorm01@gmail.com
Last edited Oct 30, 2024
Created on Sep 4, 2024

This example displays the first row of a shopping habits dataset as a formatted JSON object in a container. It prints the data as a `<pre>` element with a font size of 20 pixels using template literals and `innerHTML`. The dataset, imported from `data.csv` and listed with its full header row, includes columns like age, gender, item purchased, category, location, and review rating. The code first converts several quantitative attributes, such as `Customer_ID`, `Age`, and `Purchase_Amount_USD`, to numbers using the unary plus operator before rendering the sample.

AI-generated description

The Shopping Habits Dataset

The description comes from the original dataset source:

The Shopping Habits Dataset provides insight into consumer preferences, tendencies, and patterns during their shopping experiences. The dataset includes a range of variables, including demographic information, purchase history, product preferences, shopping frequency, and online/offline shopping behavior. This data allows analysts and researchers to further understand consumer decision-making processes, helping businesses to craft targeted marketing strategies, optimizing product offerings, and enhancing overall customer satisfaction.

Five tasks to be completed on this dataset:

  1. I want to identify which states have the best review ratings.
  2. I want to visualize the distribution of items purchased by gender.
  3. I want to understand which items and categories are being purchased most in each season.
  4. I want to determine if there is a correlation between the purchase amount and presence of discounts or promo codes.
  5. I want to be able to see if certain colors of each item are being purchased most.
MIT Licensed

Similar vizzes

Loading thumbnail…

Grouped States Genders

This example displays the first row of a dataset as a JSON object, showing a state's name, gender category, and total sales. The visualization uses JavaScript to load the CSV data, convert the "Total_Sales" field to a numeric type, and output the first record formatted in a `<pre>` tag. It is built with the `index.js` file, which imports data from `grouped_states_genders.csv`, and the source is the Shopping Habits Dataset from Kaggle. The example demonstrates a minimal, code-based preview of the data structure.

Mmacgregorm01@gmail.com
74% match
Loading thumbnail…

Grouped Seasons Genders

This example visualizes the total sales for each season, broken down by gender, using a simple dataset derived from the Shopping Habits Dataset. The rendering displays the raw data from the CSV file as formatted JSON text within an HTML container. The code loads the data with an import statement, converts the `Total_Sales` values to numbers, and uses a container’s `innerHTML` property to present the first data record with a specific font size.

Mmacgregorm01@gmail.com
70% match
Loading thumbnail…

Inspecting some data

This example loads a CSV dataset of automobile fuel consumption from a remote URL and displays a plain-text summary of its basic structure: row count, column count, and file size in kilobytes. It then prints the first ten rows of the data as formatted JSON. The implementation uses d3.csv to fetch and parse the data, d3.csvFormat to calculate the raw size, and d3.select to append multiple <pre> elements to the body, with JSON.stringify providing readable output.

RRod Potter
70% match
Loading thumbnail…

1. Diabetes Self-Management Data

This example displays the first record of the Diabetes Self-Management dataset as a formatted JSON object in a large monospace font. The code parses a CSV file, converting age and year to numbers and transforming diabetes and heart disease statuses into booleans. It uses the `JSON.stringify` method to serialize the data, which is then inserted into the container's innerHTML within a `<pre>` tag. The visualization provides a raw data preview, highlighting the dataset's structure and initial content.

Oomniaabouhassan@gmail.com
70% match
Loading thumbnail…

Supermarket Sales

This example shows the raw contents of a supermarket sales dataset as a formatted JSON preview, displaying fields such as branch, product line, unit price, quantity, tax, total, and rating. It demonstrates a simple data-loading pattern: the code initially sets a loading state, fetches the CSV file, and parses it with `d3.csvParse`. The parsed data is then rendered into a `<pre>` element using D3's data join (`select`, `data`, `join`), giving a clear view of the structured records. The visualization is built with D3 v7 and uses a minimal state management approach.

GGauri Jare
69% match
Loading thumbnail…

Collective Shopping Habit Views

This collection of interactive visualizations explores a shopping habits dataset, revealing patterns in sales, customer ratings, and purchasing behavior across states, seasons, and genders. The views include a scatterplot of overall data distribution, a choropleth map of state ratings using `d3.geoPath`, and additional scatter and stacked bar charts breaking down sales by state, season, and gender. Built with D3.js and embedded via iframes, the charts support business strategy by highlighting geographic and demographic trends. The dataset originates from Kaggle's Consumer Behavior and Shopping Habits Dataset.

Mmacgregorm01@gmail.com
69% match
Loading thumbnail…

Data Table Summary

This example shows a plain-text summary of a tabular dataset. It prints the number of rows, columns, and file size in kilobytes, followed by the first ten rows displayed as formatted JSON. The code uses `d3.csv` to load the data, `csvFormat` to compute its size, and `JSON.stringify` to display the preview. Styled with black background and green monospace text, it renders the output into `pre` elements appended to the page body, drawing from the 2013 stock price dataset.

Vveagy
68% match
Loading thumbnail…

Data Table Summary

This visualization displays a plain-text summary of a CSV file containing product data, showing the total number of rows, columns, and file size in kilobytes, followed by the first ten records as formatted JSON. The code uses D3 v5’s `select` and `csv` functions to fetch and parse the data, then appends `<pre>` elements to the page body. The dataset includes product names, prices, SKU numbers, and promotional details from an e‑commerce listing. The dark background with green monospaced text evokes a terminal aesthetic.

NNikkor
68% match