Upload to git

2023-05-31 22:17:14 -05:00
commit c207497e17
15 changed files with 5692 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,2 @@
+node_modules/
+dist/
--- a/.idea/.gitignore
+++ b/.idea/.gitignore
@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
--- a/.idea/balloonMap.iml
+++ b/.idea/balloonMap.iml
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+    <orderEntry type="library" name="lodash" level="application" />
+  </component>
+</module>
--- a/.idea/jsLibraryMappings.xml
+++ b/.idea/jsLibraryMappings.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="JavaScriptLibraryMappings">
+    <file url="PROJECT" libraries="{lodash}" />
+    <includedPredefinedLibrary name="Node.js Core" />
+  </component>
+</project>
--- a/.idea/modules.xml
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/balloonMap.iml" filepath="$PROJECT_DIR$/.idea/balloonMap.iml" />
+    </modules>
+  </component>
+</project>
--- a/.idea/vcs.xml
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$" vcs="Git" />
+  </component>
+</project>
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,31 @@
+{
+  "name": "balloonmap",
+  "version": "1.0.0",
+  "description": "",
+  "main": "webpack.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "build": "webpack --config webpack.config.js",
+    "start": "webpack serve --config webpack.config.js"
+  },
+  "author": "MrARM",
+  "license": "ISC",
+  "devDependencies": {
+    "buffer": "^6.0.3",
+    "cesium": "^1.105.2",
+    "copy-webpack-plugin": "^11.0.0",
+    "css-loader": "^6.8.1",
+    "html-webpack-plugin": "^5.5.1",
+    "style-loader": "^3.3.3",
+    "url-loader": "^4.1.1",
+    "webpack": "^5.84.1",
+    "webpack-cli": "^5.1.1",
+    "webpack-dev-server": "^4.15.0"
+  },
+  "dependencies": {
+    "axios": "^1.4.0",
+    "mqtt": "^4.3.7",
+    "process": "^0.11.10",
+    "url": "^0.11.0"
+  }
+}
--- a/src/css/main.css
+++ b/src/css/main.css
@@ -0,0 +1,7 @@
+html, body, #cesiumContainer {
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+}
--- a/src/index.html
+++ b/src/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+        <title>Radiosonde 3D map</title>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport"
+          content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
+    </head>
+    <body>
+        <div id="cesiumContainer"></div>
+        </div>
+        <script src="https://unpkg.com/lodash@4.17.20"></script>
+    </body>
+</html>
--- a/src/index.js
+++ b/src/index.js
@@ -0,0 +1,123 @@
+// Initial code from https://github.com/TheSkorm/sondehub-cesium/blob/main/src/index.js
+// Inspired by SDRAngel's 3D map
+
+import axios from 'axios';
+import {
+    Cartesian2,
+    Cartesian3,
+    Color,
+    createOsmBuildings,
+    createWorldTerrain,
+    Ion,
+    JulianDate,
+    LabelStyle,
+    Math,
+    OpenStreetMapImageryProvider,
+    SampledPositionProperty,
+    Viewer,
+    VerticalOrigin
+} from 'cesium';
+import 'cesium/Build/Cesium/Widgets/widgets.css';
+import './mqtt-patch'
+import '../src/css/main.css';
+import * as mqtt from 'mqtt';
+
+Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI1YjcxYmFhYy1jZDE1LTQwNzMtOGZkNi00N2ZkMTQxNmQwMWEiLCJpZCI6MTQzMjIzLCJpYXQiOjE2ODU1NDUxMzB9.gk9b62qayRxt91wibNoLolzauT8iY6uMCEa2APsuIsQ';
+
+// Initialize the Cesium Viewer in the HTML element with the `cesiumContainer` ID.
+const viewer = new Viewer('cesiumContainer', {
+    terrainProvider: createWorldTerrain(),
+    imageryProvider: new OpenStreetMapImageryProvider()
+});
+
+// Start motion
+viewer.clockViewModel.shouldAnimate = true;
+
+// Add Cesium OSM Buildings, a global 3D buildings layer.
+viewer.scene.primitives.add(createOsmBuildings());
+
+// Fly the camera to an overview of the US
+viewer.camera.flyTo({
+    destination : Cartesian3.fromDegrees(-98.579, 39.828, 1000000*5),
+    orientation : {
+        heading : Math.toRadians(0.0),
+        pitch : Math.toRadians(-90.0),
+
+    }
+});
+
+// Sonde processing functions
+let sondes = {};
+const processSonde = sonde => {
+    const pos = Cartesian3.fromDegrees(sonde.lon, sonde.lat, sonde.alt);
+    const time = JulianDate.fromDate(new Date(Date.parse(sonde.datetime)));
+    if (sonde.serial in sondes){ // check if serial already in there
+        sondes[sonde.serial].position.addSample(time, pos)
+    } else {
+
+        const property = new SampledPositionProperty();
+        property.addSample(time, pos);
+
+        sondes[sonde.serial] = viewer.entities.add({
+            name : `${sonde.type} ${sonde.serial}`,
+            position : property,
+            path: {
+                leadTime: 1000,
+                trailTime: 1000,
+                width: 2
+            },
+            point : {
+                pixelSize : 5,
+                color : Color.RED,
+                outlineColor : Color.WHITE,
+                outlineWidth : 2
+            },
+            label : {
+                text : `${sonde.type} ${sonde.serial}`,
+                font : '10pt monospace',
+                style: LabelStyle.FILL_AND_OUTLINE,
+                outlineWidth : 2,
+                verticalOrigin : VerticalOrigin.BOTTOM,
+                pixelOffset : new Cartesian2(0, -9)
+            }
+        });
+    }
+}
+
+// Initialize the MQTT connection to Sondehub
+const client = mqtt.connect('wss://ws-reader.v2.sondehub.org/');
+
+client.on('connect', function () {
+    client.subscribe('sondes/#', function (err) {
+        if (err){
+            console.log(err)
+        }
+    })
+})
+
+client.on('message', function (topic, message) {
+    const sonde = JSON.parse(message.toString());
+    //console.log(payload);
+    processSonde( sonde );
+});
+
+// Retrieve the previous 6 hours of radiosonde data after giving the app about 5s to load
+setTimeout(()=>{
+    console.log('Fetching sondes from 6h ago');
+    axios.get('https://api.v2.sondehub.org/sondes/telemetry?duration=6h')
+        .then( (response)=> {
+            // handle success
+            Object.keys(response.data).forEach((key) => {
+                const packets = response.data[key];
+
+                // Process each sonde message from the data dumped
+                Object.keys(packets).forEach((pkey) => {
+                    processSonde(packets[pkey]);
+                });
+            });
+        })
+        .catch((error) => {
+            // handle error
+            console.error(error);
+        });
+}, 5 * 1000);
--- a/src/models/radiosondeballon.glb
+++ b/src/models/radiosondeballon.glb
--- a/src/models/radiosondeparachute.glb
+++ b/src/models/radiosondeparachute.glb
--- a/src/mqtt-patch.js
+++ b/src/mqtt-patch.js
@@ -0,0 +1,10 @@
+// @ts-ignore
+import buffer from 'buffer';
+// @ts-ignore
+import process from 'process';
+
+// Hack to get mqtt package work with Webpack 5
+window.Buffer = buffer.Buffer;
+window.process = process;
+
+export {};
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -0,0 +1,62 @@
+// The path to the CesiumJS source code
+const cesiumSource = 'node_modules/cesium/Source';
+const cesiumWorkers = '../Build/Cesium/Workers';
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const path = require('path');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+module.exports = {
+    context: __dirname,
+    devtool: 'cheap-source-map',
+    entry: {
+        app: './src/index.js'
+    },
+    output: {
+        filename: 'app.js',
+        path: path.resolve(__dirname, 'dist'),
+        sourcePrefix: ''
+    },
+    resolve: {
+        fallback: {
+            "Buffer": require.resolve('buffer/'),
+            "http": false,
+            "https": false,
+            "url":  require.resolve("url/"),
+            "process": false,
+            "zlib": false
+        },
+        mainFiles: ['index', 'Cesium']
+    },
+    mode: 'development',
+    module: {
+        rules: [{
+            test: /\.css$/,
+            use: [ 'style-loader', 'css-loader' ]
+        }, {
+            test: /\.(png|gif|jpg|jpeg|svg|xml|json)$/,
+            use: [ 'url-loader' ]
+        }]
+    },
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: 'src/index.html'
+        }),
+        // Copy Cesium Assets, Widgets, and Workers to a static directory
+        new CopyWebpackPlugin({
+            patterns: [
+                { from: path.join(cesiumSource, cesiumWorkers), to: 'Workers' },
+                { from: path.join(cesiumSource, 'Assets'), to: 'Assets' },
+                { from: path.join(cesiumSource, 'Widgets'), to: 'Widgets' },
+                { from: path.join(cesiumSource, 'ThirdParty'), to: 'ThirdParty' }
+            ]
+        }),
+        new webpack.DefinePlugin({
+            // Define relative base path in cesium for loading assets
+            CESIUM_BASE_URL: JSON.stringify('')
+        }),
+        new webpack.ProvidePlugin({
+            Buffer: ['buffer', 'Buffer'],
+        }),
+    ]
+};