Projective Geometry Playground

## Introduction

[edit | edit source]

This learning resource was created as Projective Geometry[1] Playground in which learners/students can test a projective mapping with a simple WebApp that runs completely in the browser as runtime environment (see AppLSAC). A browser is available on almost every standard operating system and AppLSAC approach allows that the course content can be shared offline between devices.

### Wiki2Reveal

[edit | edit source]

This learning resource can be displayed as Wiki2Reveal slides. It meant to be used by teachers, to explain in the classroom how the HTML and Javascript files are organized and how they can be used to explore and test the projective mappings created by students.

### Equirectangular Projection

[edit | edit source]

The learning resources was created for the Wikiversity learning resource about the equirectangular projection in a way, that the playground provides a infrastructure to start with and the students can focus on the mathematical mapping.

### Objectives

[edit | edit source]

The following aspects of Projective Geometry Playground are considered in detail:

* (1) What are the files in the projective playgrounds and why are the files part of the playground?
* (2) What is a mathematical function, that maps a pixel from the source coordinate system in the destination coordinate system?
* (3) How can the student check the result in browser and compare the generated result with the expected result?

## Target Group

[edit | edit source]

The target group for Projective Geometry Playground of the learning resource

* are teachers that what to integrated projective geometry in their lessons and want to explain the foundations of using the Projective Geometry Playground as OER with Wiki2Reveal.
* students that want to perform a specific learning task given by the teacher and need again a bit support in using the Projective Geometry Playground

## Learning Activities - Preparation

[edit | edit source]

Learning activities address mathematical skills in projective geometry. Nevertheless the Projective Geometry Playground provides the resource as HTML, CSS and Javascript files. So basic Javascript knowledge is required to use the Projective Geometry Playground. The requirements are:

* defining a function Javascript. Needed to define the coordinate transformation  T ( x , y ) = ( x ′ , y ′ ) {\displaystyle T(x,y)=(x',y')}
* setting a specific pixel on a HTML canvas. This is needed because the source images are loaded in a canvas and the destination image is created in the canvas.

### Coordinate System of Graphics

[edit | edit source]

Coordinate system in Graphics

The coordinate system of an image has a different orientation in y-axis. This is shown in the diagram.

* x m a x {\displaystyle x_{max}} is the maximal value of the on the x-axis of the image
* y m a x {\displaystyle y_{max}} is the maximal value of the on the y-axis the of the image
* The origin of the coordinate system is on the top left.

Keep this in mind, when you use the coordinate system for your experiments with projections (see also equirectangular projection.

### Explore Equirectangular Projection

[edit | edit source]

The learning resource about the equirectangular projection provides the foundations to create the an equirectangular image. Start to explore the learning resource to understand, where the equirectangular projection is used and perform the mathematical learning task for the equirectangular projection. At the end of the learning resource, you will have the mathematical function for the coordinate transformation  T ( x , y ) = ( x ′ , y ′ ) {\displaystyle T(x,y)=(x',y')} .

### Files used in Projective Geometry Playground

[edit | edit source]

The files in Projective Geometry Playground are stored in Git-repository as OER:

* (index.html) contains the information about implementation task.
* (progeoplay.html) is the main file, that contains the canvas
* (js/projection.js) is the main Javascript file, that handles the projection onto the canvas
* (css/progeoplay.css) is the cascading style sheet, that handles the layout of the Projective Geometry Playground. Feel free to change that and adapt the Open Educational Resources to the CSS of your learning resources used in the classroom.

## References

[edit | edit source]

1. ↑ Đokić, O., & Vorkapić, M. (2023, July). Тhe conceptual change approach in mathematics education: From topological primacy to projective geometry. In Thirteenth Congress of the European Society for Research in Mathematics Education (CERME13) (No. 11). Alfréd Rényi Institute of Mathematics; ERME.

## See also

[edit | edit source]

* Geometry
* Projective Geometry
* Equirectangular projection
* Wiki2Reveal
* Wikibook: Javascript

## Page Information

[edit | edit source]

You can display this page as Wiki2Reveal slides

### Wiki2Reveal

[edit | edit source]

The Wiki2Reveal slides were created for the Geometry' and the Link for the Wiki2Reveal Slides was created with the link generator.

* This page is designed as a PanDocElectron-SLIDE document type.
* Source: Wikiversity https://en.wikiversity.org/wiki/Projective Geometry Playground
* see Wiki2Reveal for the functionality of Wiki2Reveal.