Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Cars Report

Public visualization

Cars Report

0 stars0🌍 Public
Tthomasjungcoe
Last edited Mar 8, 2021
Created on Mar 5, 2021

This example displays the make of the first car in a small dataset, rendered as large text on a web page. The code defines a static JSON array of car objects and uses React with D3 to structure the visualization, though the visible output is a simple text message. The data is parsed with `JSON.parse` and accessed directly, while the `VizContainer` component sets up an SVG with margin conventions, ready for chart rendering. The project loads React, ReactDOM, and D3 via CDN links.

AI-generated description

Boilerplate code for a React + D3 visualization with:

  • CDN links for React, ReactDOM, and D3
  • Basic React boilerplate
  • Variables for dimensions and margins
  • A VizContainer component that:
    • Abstracts SVG/group container elements
    • Follows the margin convention
    • Show the margins, which can be easily removed by deleting the showMargins={true} prop

Comments

Sign in to join the discussion.

MIT Licensed