Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 

README.md

Quality of Life Dashboard

Documentation Maintenance License: MIT Twitter: fuzzytolerance

Neighborhood indicators dashboard built with Vue and Mapbox GL JS.

🏠 Homepage

Prerequisites

  • git >= 1.0.0
  • npm >=5.5.0
  • node >=9.3.0

Install

git clone https://github.com/tobinbradley/quality-of-life-dashboard.git dashboard
cd dashboard
npm install
git clone https://github.com/tobinbradley/mecklenburg-quality-of-life-data.git data
npm install

You will have to add a data configuration folder for the Dashboard to work. An automatic data configuration for a US State or County can be achieved the quality-of-life-data-uscensus repo. From the dashboard directory:

git clone https://github.com/tobinbradley/quality-of-life-data-uscensus.git data
cd data
npm install

You can find out how to set a state or county FIPS code in the readme.

Alternately, you can use Mecklenburg County's data repo:

git clone https://github.com/tobinbradley/mecklenburg-quality-of-life-data.git data

Usage

For development:

npm run start

Build for production:

npm run build

Options

site.js has a number of customization settings you can set.

{
  // REQUIRED
  // The title of the app as it appears on the page and in the title meta
  title: 'Charlotte/Mecklenburg Quality of Life Explorer',
  // REQUIRED
  // Author meta tag
  author: 'Tobin Bradley',
  // REQUIRED
  // Key word meta tag
  keywords:
    'GIS,Mecklenburg County,parks,libraries,schools,environment,impervious surface,floodplain,zoning,assessment,tax,photos,government',
  // REQUIRED
  // Description meta tag
  description:
    'Exploring neighborhood character, economics, education, engagement, environment, health, housing, safety and transportation.',
  // OPTIONAL
  // Google analitics tracking key
  // Note if you don't want to use this, you can strip out the GA code in
  // public/index.html and public/embed.html
  gaKey: 'UA-48797957-1',
  // OPTIONAL
  // Location to post contact form. Requires 'submit', 'email', and 'message'
  // post arguments.
  contactForm: 'https://mcmap.org/utilities/mail-qol.php',
  // OPTIONAL
  // YouTube help video URL
  // Make sure to include ?enablejsapi=1 on the end or it won't stop playing
  // when the modal goes away.
  helpUrl: 'https://www.youtube.com/embed/dQw4w9WgXcQ?enablejsapi=1',
  // OPTIONAL
  // Links for the left nav bar
  navLinks: [
    {
      title: 'About',
      url: 'http://charlottenc.gov/HNS/CE/CommunityInfo/Pages/QOL.aspx'
    },
    {
      title: 'Download Data',
      url: 'https://mcmap.org/qol/downloads/qol-data.zip'
    },
    {
      title: 'Charlotte Open Data Portal',
      url: 'http://clt.charlotte.opendata.arcgis.com/'
    },
    {
      title: 'Mecklenburg Open Mapping',
      url: 'http://maps.co.mecklenburg.nc.us/openmapping/'
    }
  ]
}

The page footer content can also be customized by editing src/components/Footer.vue. The left nav bar logo image is located at src/assets/logo.svg, the report page image is located at src/assets/report.jpg, and the footer image is located at src/assets/seals.png.

A PHP MVP for the contact form would look like this:

<?php
if (isset($_POST['submit'])) {
  $to = "you@email.com";
  $message = "From: " . $_POST['email'] . "\r\n" . $_POST['message'];
  $message = wordwrap($message, 70, "\r\n");
  $headers = 'From: Web Feedback <no-reply@yoursite.org>' . "\r\n";
  mail($to, "Quality of Life Feedback", $message, $headers);
}
?>

Author

👤 Tobin Bradley

🤝 Contributing

Contributions, issues and feature requests are welcome!
Feel free to check issues page.

Show your support

Give a ⭐️ if this project helped you!

📝 License

Copyright © 2019 Tobin Bradley.
This project is MIT licensed.


This README was generated with ❤️ by readme-md-generator

About

Neighborhood indicators dashboard built with Vue and Mapbox GL JS

Resources

License

Releases

No releases published

Packages

No packages published
You can’t perform that action at this time.