Skip to content

simsjack30/D3_Portfolio

Repository files navigation

D3 Portfolio Site

This site was built as a demonstration of complex data visualization for web-based applications using D3, the Layer Cake framework, and LayerChart. The site is built using Svelte, SvelteKit, and Svelte-UX. The application features three different charts, each displaying a significantly different dataset and visualization method:

  • United States Choropleth: Sources information from census data.
  • Map with Static Tile API Calls: Displays satellite imagery.
  • Historic Stock Graphic: Sources information from financial price history.

You can visit the live site here!


How to Build It Yourself

  1. Clone the Repository
    git clone https://github.com/simsjack30/D3_Portfolio.git

  2. Install Dependencies
    Navigate to the project directory and run:
    npm install

  3. Substitute Static Tile API
    Replace the static tile API with your choice. (I used Mapbox.)

  4. Connect to Live Data
    Hook up your project to the live data sources referenced in the applicable +page.ts files, or use the static files provided.

  5. Run the Development Server
    Start the development server with:
    npm run dev


Explore my other projects on GitHub