SlideShare a Scribd company logo
1 of 6
Car simulator initial plan.
Sharon Xiao Liu.
2024/03/19.
Contents.
1. General plan.
2. First version of the simulator.
3. Possible JavaScript functions required.
4. Mathematical equations.
General plan.
• The car simulator, will be programmed in JavaScript.
• It will have a windscreen view, side window views, and rear window view.
• It will have mirror views:
oSide mirror views.
oWindscreen mirror view.
• It will have indicator light switches.
• It will have a gearstick, steering wheel, and foot pedals.
• It can be turn-based, like an Interactive Fiction game. Or, it can be played at
different speeds. It could respond to a script, which programs the drive.
• The purpose of this simulator, is to teach people how to drive. (You can make
one, too.)
Features of the first version of the simulator.
• There is going to be, a road with a left turn.
• There is going to be a turn-based simulation.
• There will be a bird's eye view, of the road
with the left turn.
• There will be a clutch pedal, gearstick and
steering wheel.
• The car is going to go along in units, along the
road, and it is going to be steered.
• The simulator will crash, if you get an
instruction wrong.
Possible JavaScript functions (or web
programming functions) required.
• Use Scalable Vector Graphics, with JavaScript, for
the bird's eye view.
o Draw a rectangle, with <rect>.
o Use the rotate() and translate()
transformations, with <rect>.
o Use document.getElementById() , to
access SVG tags.
o Use .setAttribute() method, to change the
SVG tags.
• With a turn-based simulation, there is no need
to smoothly animate, the path of the car.
• Use a HTML form, for the car controls.
o The clutch pedal is a toggle button.
o The gearstick is a form control, which has a
dropdown menu.
o The steering wheel has a 12:1 steering ratio.
(Wikipedia says, this is a common ratio.)
• The car wheel turn, is inputted, and the
steering wheel angle, is calculated.
• Dashboard.
o The speed of the car, is displayed. (This affects
the translations.)
Equations, for the first version of the car
simulator.
• Speed = distance/time.
• Steering wheel angle = 12*car
wheel angle.

More Related Content

Similar to 20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.

Self-Driving Car to Drive Autonomously using Image Processing and Deep Learning
Self-Driving Car to Drive Autonomously using Image Processing and Deep LearningSelf-Driving Car to Drive Autonomously using Image Processing and Deep Learning
Self-Driving Car to Drive Autonomously using Image Processing and Deep LearningIRJET Journal
 
3 CG_U1_P2_PPT_3 OpenGL.pptx
3 CG_U1_P2_PPT_3 OpenGL.pptx3 CG_U1_P2_PPT_3 OpenGL.pptx
3 CG_U1_P2_PPT_3 OpenGL.pptxssuser255bf1
 
Demystifying Angular Animations
Demystifying Angular AnimationsDemystifying Angular Animations
Demystifying Angular AnimationsGil Fink
 
AWS Stockholm Meetup June 2019 - Cybercom DeepRacer story
AWS Stockholm Meetup June 2019 - Cybercom DeepRacer storyAWS Stockholm Meetup June 2019 - Cybercom DeepRacer story
AWS Stockholm Meetup June 2019 - Cybercom DeepRacer storyRolf Koski
 
AWS Finland Meetup June 2019 - DeepRacer story
AWS Finland Meetup June 2019 - DeepRacer storyAWS Finland Meetup June 2019 - DeepRacer story
AWS Finland Meetup June 2019 - DeepRacer storyJouni Luoma
 
Simulation of robotic positions and programming
Simulation of robotic positions and programmingSimulation of robotic positions and programming
Simulation of robotic positions and programmingRachit Laharia
 
Firefox WebGL developer tools
Firefox WebGL developer toolsFirefox WebGL developer tools
Firefox WebGL developer toolsVictor Porof
 
Web development basics (Part-3)
Web development basics (Part-3)Web development basics (Part-3)
Web development basics (Part-3)Rajat Pratap Singh
 
What is the Hero Class in Flutter Development.pptx
What is the Hero Class in Flutter Development.pptxWhat is the Hero Class in Flutter Development.pptx
What is the Hero Class in Flutter Development.pptxBOSC Tech Labs
 
frontend-161011205424 (1).pdf
frontend-161011205424 (1).pdffrontend-161011205424 (1).pdf
frontend-161011205424 (1).pdfkajalkumari896241
 
Autocad portfolio 2016
Autocad portfolio 2016Autocad portfolio 2016
Autocad portfolio 2016Sandu Stefan
 
FormulaPi Programming Challenge Autonomous Cars
FormulaPi Programming Challenge Autonomous CarsFormulaPi Programming Challenge Autonomous Cars
FormulaPi Programming Challenge Autonomous CarsThomas Effing
 
“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...
“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...
“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...DevClub_lv
 
Performance and Optmization - a technical talk at Frontend London
Performance and Optmization - a technical talk at Frontend LondonPerformance and Optmization - a technical talk at Frontend London
Performance and Optmization - a technical talk at Frontend Londonthomas alisi
 
From website to mobile app - a journey
From website to mobile app - a journeyFrom website to mobile app - a journey
From website to mobile app - a journeyMartin Naumann
 

Similar to 20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator. (20)

Self-Driving Car to Drive Autonomously using Image Processing and Deep Learning
Self-Driving Car to Drive Autonomously using Image Processing and Deep LearningSelf-Driving Car to Drive Autonomously using Image Processing and Deep Learning
Self-Driving Car to Drive Autonomously using Image Processing and Deep Learning
 
Automatic Plowing System
Automatic Plowing SystemAutomatic Plowing System
Automatic Plowing System
 
3 CG_U1_P2_PPT_3 OpenGL.pptx
3 CG_U1_P2_PPT_3 OpenGL.pptx3 CG_U1_P2_PPT_3 OpenGL.pptx
3 CG_U1_P2_PPT_3 OpenGL.pptx
 
Synergis University 2014 - Inventor Performance Optimization
Synergis University 2014 - Inventor Performance OptimizationSynergis University 2014 - Inventor Performance Optimization
Synergis University 2014 - Inventor Performance Optimization
 
Demystifying Angular Animations
Demystifying Angular AnimationsDemystifying Angular Animations
Demystifying Angular Animations
 
AWS Stockholm Meetup June 2019 - Cybercom DeepRacer story
AWS Stockholm Meetup June 2019 - Cybercom DeepRacer storyAWS Stockholm Meetup June 2019 - Cybercom DeepRacer story
AWS Stockholm Meetup June 2019 - Cybercom DeepRacer story
 
AWS Finland Meetup June 2019 - DeepRacer story
AWS Finland Meetup June 2019 - DeepRacer storyAWS Finland Meetup June 2019 - DeepRacer story
AWS Finland Meetup June 2019 - DeepRacer story
 
Simulation of robotic positions and programming
Simulation of robotic positions and programmingSimulation of robotic positions and programming
Simulation of robotic positions and programming
 
Firefox WebGL developer tools
Firefox WebGL developer toolsFirefox WebGL developer tools
Firefox WebGL developer tools
 
Web development basics (Part-3)
Web development basics (Part-3)Web development basics (Part-3)
Web development basics (Part-3)
 
What is the Hero Class in Flutter Development.pptx
What is the Hero Class in Flutter Development.pptxWhat is the Hero Class in Flutter Development.pptx
What is the Hero Class in Flutter Development.pptx
 
frontend-161011205424 (1).pdf
frontend-161011205424 (1).pdffrontend-161011205424 (1).pdf
frontend-161011205424 (1).pdf
 
Web Development
Web DevelopmentWeb Development
Web Development
 
Autocad portfolio 2016
Autocad portfolio 2016Autocad portfolio 2016
Autocad portfolio 2016
 
Project Report
Project ReportProject Report
Project Report
 
FormulaPi Programming Challenge Autonomous Cars
FormulaPi Programming Challenge Autonomous CarsFormulaPi Programming Challenge Autonomous Cars
FormulaPi Programming Challenge Autonomous Cars
 
“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...
“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...
“Accident Reconstruction” by Aleksis Liekna from Scope Technologies at Auto f...
 
Performance and Optmization - a technical talk at Frontend London
Performance and Optmization - a technical talk at Frontend LondonPerformance and Optmization - a technical talk at Frontend London
Performance and Optmization - a technical talk at Frontend London
 
From website to mobile app - a journey
From website to mobile app - a journeyFrom website to mobile app - a journey
From website to mobile app - a journey
 
Angular js 1.3 basic tutorial
Angular js 1.3 basic tutorialAngular js 1.3 basic tutorial
Angular js 1.3 basic tutorial
 

More from Sharon Liu

20240408 Bending Backwards to the Second Step Up.docx
20240408 Bending Backwards to the Second Step Up.docx20240408 Bending Backwards to the Second Step Up.docx
20240408 Bending Backwards to the Second Step Up.docxSharon Liu
 
20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...
20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...
20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...Sharon Liu
 
SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.
SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.
SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.Sharon Liu
 
20240308 Jumping from the Fifth step up.docx
20240308 Jumping from the Fifth step up.docx20240308 Jumping from the Fifth step up.docx
20240308 Jumping from the Fifth step up.docxSharon Liu
 
20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docx
20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docx20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docx
20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docxSharon Liu
 
20231218 Plan for Two-Footed Jump on Ice.docx
20231218 Plan for Two-Footed Jump on Ice.docx20231218 Plan for Two-Footed Jump on Ice.docx
20231218 Plan for Two-Footed Jump on Ice.docxSharon Liu
 
20231130 Ice skating Unsupported.docx
20231130 Ice skating Unsupported.docx20231130 Ice skating Unsupported.docx
20231130 Ice skating Unsupported.docxSharon Liu
 
20231102 Plan for Ice Skating.docx
20231102 Plan for Ice Skating.docx20231102 Plan for Ice Skating.docx
20231102 Plan for Ice Skating.docxSharon Liu
 
20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docx
20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docx20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docx
20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docxSharon Liu
 
20231006 Sphere rotated 45 degrees down.docx
20231006 Sphere rotated 45 degrees down.docx20231006 Sphere rotated 45 degrees down.docx
20231006 Sphere rotated 45 degrees down.docxSharon Liu
 
20230904 Recycling Clay.docx
20230904 Recycling Clay.docx20230904 Recycling Clay.docx
20230904 Recycling Clay.docxSharon Liu
 
20230831 a of the equator - Rotated sphere.docx
20230831 a of the equator - Rotated sphere.docx20230831 a of the equator - Rotated sphere.docx
20230831 a of the equator - Rotated sphere.docxSharon Liu
 
20230829 Rotated Ellipse.docx
20230829 Rotated Ellipse.docx20230829 Rotated Ellipse.docx
20230829 Rotated Ellipse.docxSharon Liu
 
20230819 Recall Tests.pptx
20230819 Recall Tests.pptx20230819 Recall Tests.pptx
20230819 Recall Tests.pptxSharon Liu
 
20230810 Radial Plot of an Ellipse.docx
20230810 Radial Plot of an Ellipse.docx20230810 Radial Plot of an Ellipse.docx
20230810 Radial Plot of an Ellipse.docxSharon Liu
 
20230809 South Pole of the Rotated Sphere.docx
20230809 South Pole of the Rotated Sphere.docx20230809 South Pole of the Rotated Sphere.docx
20230809 South Pole of the Rotated Sphere.docxSharon Liu
 
20230804 Rotated Sphere with new North Pole.docx
20230804 Rotated Sphere with new North Pole.docx20230804 Rotated Sphere with new North Pole.docx
20230804 Rotated Sphere with new North Pole.docxSharon Liu
 
20230802 Horizontal Sphere.docx
20230802 Horizontal Sphere.docx20230802 Horizontal Sphere.docx
20230802 Horizontal Sphere.docxSharon Liu
 
20230727 Upright Sphere from North Pole.docx
20230727 Upright Sphere from North Pole.docx20230727 Upright Sphere from North Pole.docx
20230727 Upright Sphere from North Pole.docxSharon Liu
 
20230724 3D Off Centre Line.docx
20230724 3D Off Centre Line.docx20230724 3D Off Centre Line.docx
20230724 3D Off Centre Line.docxSharon Liu
 

More from Sharon Liu (20)

20240408 Bending Backwards to the Second Step Up.docx
20240408 Bending Backwards to the Second Step Up.docx20240408 Bending Backwards to the Second Step Up.docx
20240408 Bending Backwards to the Second Step Up.docx
 
20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...
20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...
20240315 ACMJ Diagrams Set 2.docx . With light, motor, coloured light, and se...
 
SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.
SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.
SL CV 20240312.docx . Sharon Xiao Liu's Curriculum Vitae.
 
20240308 Jumping from the Fifth step up.docx
20240308 Jumping from the Fifth step up.docx20240308 Jumping from the Fifth step up.docx
20240308 Jumping from the Fifth step up.docx
 
20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docx
20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docx20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docx
20240206 Rotated Torus and Full Rotated Sphere 45 degrees down 45 left.docx
 
20231218 Plan for Two-Footed Jump on Ice.docx
20231218 Plan for Two-Footed Jump on Ice.docx20231218 Plan for Two-Footed Jump on Ice.docx
20231218 Plan for Two-Footed Jump on Ice.docx
 
20231130 Ice skating Unsupported.docx
20231130 Ice skating Unsupported.docx20231130 Ice skating Unsupported.docx
20231130 Ice skating Unsupported.docx
 
20231102 Plan for Ice Skating.docx
20231102 Plan for Ice Skating.docx20231102 Plan for Ice Skating.docx
20231102 Plan for Ice Skating.docx
 
20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docx
20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docx20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docx
20231017 xy view of Rotated 45 degrees down and 45 left Sphere.docx
 
20231006 Sphere rotated 45 degrees down.docx
20231006 Sphere rotated 45 degrees down.docx20231006 Sphere rotated 45 degrees down.docx
20231006 Sphere rotated 45 degrees down.docx
 
20230904 Recycling Clay.docx
20230904 Recycling Clay.docx20230904 Recycling Clay.docx
20230904 Recycling Clay.docx
 
20230831 a of the equator - Rotated sphere.docx
20230831 a of the equator - Rotated sphere.docx20230831 a of the equator - Rotated sphere.docx
20230831 a of the equator - Rotated sphere.docx
 
20230829 Rotated Ellipse.docx
20230829 Rotated Ellipse.docx20230829 Rotated Ellipse.docx
20230829 Rotated Ellipse.docx
 
20230819 Recall Tests.pptx
20230819 Recall Tests.pptx20230819 Recall Tests.pptx
20230819 Recall Tests.pptx
 
20230810 Radial Plot of an Ellipse.docx
20230810 Radial Plot of an Ellipse.docx20230810 Radial Plot of an Ellipse.docx
20230810 Radial Plot of an Ellipse.docx
 
20230809 South Pole of the Rotated Sphere.docx
20230809 South Pole of the Rotated Sphere.docx20230809 South Pole of the Rotated Sphere.docx
20230809 South Pole of the Rotated Sphere.docx
 
20230804 Rotated Sphere with new North Pole.docx
20230804 Rotated Sphere with new North Pole.docx20230804 Rotated Sphere with new North Pole.docx
20230804 Rotated Sphere with new North Pole.docx
 
20230802 Horizontal Sphere.docx
20230802 Horizontal Sphere.docx20230802 Horizontal Sphere.docx
20230802 Horizontal Sphere.docx
 
20230727 Upright Sphere from North Pole.docx
20230727 Upright Sphere from North Pole.docx20230727 Upright Sphere from North Pole.docx
20230727 Upright Sphere from North Pole.docx
 
20230724 3D Off Centre Line.docx
20230724 3D Off Centre Line.docx20230724 3D Off Centre Line.docx
20230724 3D Off Centre Line.docx
 

Recently uploaded

Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)OPEN KNOWLEDGE GmbH
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityNeo4j
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - InfographicHr365.us smith
 
Intelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalmIntelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalmSujith Sukumaran
 
The Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfThe Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfPower Karaoke
 
software engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptxsoftware engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptxnada99848
 
Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024Andreas Granig
 
chapter--4-software-project-planning.ppt
chapter--4-software-project-planning.pptchapter--4-software-project-planning.ppt
chapter--4-software-project-planning.pptkotipi9215
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackVICTOR MAESTRE RAMIREZ
 
Folding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a seriesFolding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a seriesPhilip Schwarz
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataBradBedford3
 
Implementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureImplementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureDinusha Kumarasiri
 
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...MyIntelliSource, Inc.
 
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASEBATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASEOrtus Solutions, Corp
 
What is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need ItWhat is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need ItWave PLM
 
MYjobs Presentation Django-based project
MYjobs Presentation Django-based projectMYjobs Presentation Django-based project
MYjobs Presentation Django-based projectAnoyGreter
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...Christina Lin
 
React Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaReact Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaHanief Utama
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...gurkirankumar98700
 
Unveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsUnveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsAhmed Mohamed
 

Recently uploaded (20)

Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered Sustainability
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - Infographic
 
Intelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalmIntelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalm
 
The Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfThe Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdf
 
software engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptxsoftware engineering Chapter 5 System modeling.pptx
software engineering Chapter 5 System modeling.pptx
 
Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024
 
chapter--4-software-project-planning.ppt
chapter--4-software-project-planning.pptchapter--4-software-project-planning.ppt
chapter--4-software-project-planning.ppt
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStack
 
Folding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a seriesFolding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a series
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
 
Implementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureImplementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with Azure
 
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
Try MyIntelliAccount Cloud Accounting Software As A Service Solution Risk Fre...
 
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASEBATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
BATTLEFIELD ORM: TIPS, TACTICS AND STRATEGIES FOR CONQUERING YOUR DATABASE
 
What is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need ItWhat is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need It
 
MYjobs Presentation Django-based project
MYjobs Presentation Django-based projectMYjobs Presentation Django-based project
MYjobs Presentation Django-based project
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
 
React Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaReact Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief Utama
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
 
Unveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsUnveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML Diagrams
 

20240319 Car Simulator Plan.pptx . Plan for a JavaScript Car Driving Simulator.

  • 1. Car simulator initial plan. Sharon Xiao Liu. 2024/03/19.
  • 2. Contents. 1. General plan. 2. First version of the simulator. 3. Possible JavaScript functions required. 4. Mathematical equations.
  • 3. General plan. • The car simulator, will be programmed in JavaScript. • It will have a windscreen view, side window views, and rear window view. • It will have mirror views: oSide mirror views. oWindscreen mirror view. • It will have indicator light switches. • It will have a gearstick, steering wheel, and foot pedals. • It can be turn-based, like an Interactive Fiction game. Or, it can be played at different speeds. It could respond to a script, which programs the drive. • The purpose of this simulator, is to teach people how to drive. (You can make one, too.)
  • 4. Features of the first version of the simulator. • There is going to be, a road with a left turn. • There is going to be a turn-based simulation. • There will be a bird's eye view, of the road with the left turn. • There will be a clutch pedal, gearstick and steering wheel. • The car is going to go along in units, along the road, and it is going to be steered. • The simulator will crash, if you get an instruction wrong.
  • 5. Possible JavaScript functions (or web programming functions) required. • Use Scalable Vector Graphics, with JavaScript, for the bird's eye view. o Draw a rectangle, with <rect>. o Use the rotate() and translate() transformations, with <rect>. o Use document.getElementById() , to access SVG tags. o Use .setAttribute() method, to change the SVG tags. • With a turn-based simulation, there is no need to smoothly animate, the path of the car. • Use a HTML form, for the car controls. o The clutch pedal is a toggle button. o The gearstick is a form control, which has a dropdown menu. o The steering wheel has a 12:1 steering ratio. (Wikipedia says, this is a common ratio.) • The car wheel turn, is inputted, and the steering wheel angle, is calculated. • Dashboard. o The speed of the car, is displayed. (This affects the translations.)
  • 6. Equations, for the first version of the car simulator. • Speed = distance/time. • Steering wheel angle = 12*car wheel angle.