Giter Club home page Giter Club logo

coup-frontend's Introduction

GRASBROOK FUNCTIONAL SCOPE

abm

Features

The Grasbrook Functional Scope provides a mapbox based application to support functional planning for a new urban neighborhood. Users will be able to simulate pedestrian flows, stormwater runoffs, traffic noise propagation, sun exposure and wind speeds. With more modules to come.

overview_webtool_large

Building classification and detail information

rotating

Pedestrian Flow Analysis

abm

Noise Propagation Analysis

noise

Multi Layer Analysis

Explore interrelationships of different result layers. Example: In which areas are many pedestrians exposed to high traffic noise?

multi_layer

Stormwater RunOff Analysis

Wind speed and Sun-Exposure Analysis

Video to be uploaded

Project setup

Clone the project from github

RUN in development mode

  • Create a local file containing you CityPyo login credentials in src/config/cityPyoDefaultUser.json
{
  "username": "YourUserName", "password": "YourPassword"
}
  • Run CityPyO locally on port 5000 Or update the .env.development file to connect to nc.hcu-hamburg.de/cityPyo

  • Update the .env.development and set your user and password for the calculations api, in order to request noise, stormwater, sun and wind calculations

Install dependencies

npm install

Serve front-end locally

npm start

View the app in a browser at localhost:8080

RUN in production mode

Create a local file containing you CityPyo login credentials in src/config/cityPyoDefaultUser.json This file can be an empty JSON e.g. {}

build source

npm i && npm run build

Detail Info

Files needed

Buildings

The buildings displayed on the map are stacked extrusions of 3 geojson layers. Please provide a groundfloor.json, upperfloor.json and rooftop.json via your CityPyo user.

Following properties can provided per Feature. Mandatory for the visualization to work are city_scope_id and land_use_detailed_type. Upperfloor features must contain a float value for building_height Rooftop features must contain float values for building_height and additional_roof_height

{"building_id": "G03", "land_use_detailed_type": "residential", "building_height": 44.3, "additional_roof_height": 47.5, "area_planning_type": "building", "floor_area": 341.8590000002878, "city_scope_id": "B-03-1"}

OpenSpaces

The open spaces displayed are read from a spaces.json provided by your CityPyo user. Following properties can provided per Feature. Mandatory for the visualization to work are city_scope_id and land_use_detailed_type.

"properties": {"area_planning_type": "specialUseArea", "land_use_general_type": "privateOS", "land_use_detailed_type": "schoolOutdoorArea", "floor_area": 2774.420039495546, "city_scope_id": "S-283"}

Static results

Provide result files for the ABM results and Noise results (currently static). Please ask maintainers for example files.

coup-frontend's People

Contributors

andredaa avatar totev avatar bertramhillmann avatar quving avatar dependabot[bot] avatar jlsievert avatar illsio avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.