Space Satellites

I've considered using D3.js for this mini project; however, I always wanted to invest more time developing my skills in 3D CSS and Javascript. Hence, I've opted for the use of Vue.js and SVGs. Using methods and v-for made it simple to display the data and manipulate it. In a future project, I'll develop a more in-depth model with Python or D3.js.

Creating the model

Taking advantage of the v-for directive, the orbit can be displayed easily with the correct degree of inclination using transform with the :style prop.


Loading the data into the model

Looping though all the data in the JSON file, 50 datasets will be appended to an array to be used inside the Vue SVG to limit the number of being rendered.