https://github.com/hideba/flatcitybuf-web-prototype
https://github.com/hideba/flatcitybuf-web-prototype
Last synced: over 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/hideba/flatcitybuf-web-prototype
- Owner: HideBa
- Created: 2025-01-23T14:07:55.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-27T17:33:30.000Z (over 1 year ago)
- Last Synced: 2025-02-28T00:59:03.049Z (over 1 year ago)
- Language: TypeScript
- Size: 376 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# FlatCityBuffer Viewer
A front-end prototype implementation for visualizing FlatCityBuffer data, which is a FlatBuffer encoding of CityJSON. This viewer demonstrates efficient spatial data retrieval using HTTP range requests and WebAssembly bindings.
## Overview
This project showcases:
- Efficient spatial data retrieval using FlatCityBuffer's WASM bindings
- HTTP range requests to fetch only the required data extent
- Interactive map interface using CesiumJS
- Real-time visualization of CityJSON data
- Statistical analysis of building attributes
## Features
- πΊοΈ Interactive map with drawing tools for area selection
- π¦ Efficient data loading using HTTP range requests
- π Statistical analysis of building attributes
- π JSON viewer for detailed data inspection
- ποΈ Download CityJSONSeq file only for selected area
## Technology Stack
- React + TypeScript
- Vite for build tooling
- CesiumJS for map rendering
- TailwindCSS + shadcn/ui for styling
- [FlatCityBuffer WASM bindings](https://github.com/flatcitybuf/flatcitybuf-wasm)
- proj4js for coordinate transformations
## Getting Started
### Prerequisites
- Node.js (v18 or later)
- npm (v9 or later)
- Git
### Installation
1. Clone the repository with submodules:
```bash
git clone --recursive https://github.com/yourusername/flatcitybuffer-viewer.git
cd flatcitybuffer-viewer
```
2. Install dependencies:
```bash
npm install
```
3. Start the development server:
```bash
npm run dev
```
The application will be available at `http://localhost:3000`