GithubHelp home page GithubHelp logo

aaronjenson / projection Goto Github PK

View Code? Open in Web Editor NEW
0.0 2.0 0.0 541 KB

Higher dimensions, projected onto your 2D screen

Home Page: https://aaronjenson.github.io/Projection/

License: GNU General Public License v3.0

JavaScript 6.02% TypeScript 65.22% CSS 0.80% HTML 27.95%
raphaeljs angular angular-material

projection's People

Contributors

aaronjenson avatar

Watchers

 avatar  avatar

projection's Issues

UI Redesign

Add a menu button, move individual axis controls to a collapsible side menu. Add dark mode, and allow changing the thickness and style of cube lines and vertices.

Speed up drawing

Drawing w/ 5 dimensions or more significantly reduces frame rate. Should calculate all points before drawing, rather than performing rotations and projections twice or more on each point.

Live update rotation while dragging slider

If the animation is paused, then dragging the slider to change the rotation of a particular axis doesn't update the actual rotation of the cube until the slider is released, making it hard to actually determine the effects of the sliding.

Allow user to toggle projection method

Axonometric projection might be able to reduce some calculation time (helping #14), and could look cleaner in some scenarios. The option to switch back to perspective projection should be available to allow a user to choose between appearance and speed.

Axonometric projection is essentially just skipping the perspective projection step, and rather just using the calculated x and y positions of each regardless of the remaining dimension's values.

Cube sizing

2d is huge, 3d is just a little small, any higher dimensions are too small to see

Fix UX

Minor issues such as slightly off-center cube in card, not perfectly square card, etc.

Update UX for mobile

Place cube card on top, remove GitHub link, position controls under. Maybe remove card for controls to allow for just a bit more space?

Add tooltips, info, and about

Explain the rotation naming system in a dialog that appears on clicking a question mark icon, explain loosely how the project works and give attributions in a dialog that appears on clicking an about button.

Keep rotation settings persistent across dimension changes

If new dimension is smaller than old, remove any that have basis' outside of current dimension.
If new dimension is larger than old, add new rotation for each lower dimension (e.g. 1-5, 2-5, 3-5, and 4-5).
Old dimension can be calculated from rotation list.

Add reverse button

Maybe a rewind/fast forward icon next to the play/pause icon to toggle rotation direction.

Update readme

The auto-generated readme by angular-cli isn't very informative

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.