# Map an image to a polygon

**URL:** <https://ifnotnil.com/t/map-an-image-to-a-polygon/940>\
**Category:** Other\
**Created:** [8 September 2020 23:27 UTC](https://ifnotnil.com/t/map-an-image-to-a-polygon/940 "2020-09-08T23:27:24Z")\
**Posts on this page:** 6\
**Page:** 2

<div class="post-metadata">

**Author:** ![s7g2vp2](https://ifnotnil.com/letter_avatar_proxy/v4/letter/s/e9c0ed/32.png) [@s7g2vp2](https://ifnotnil.com/u/s7g2vp2)\
**Post date:** [11 September 2020 11:53 UTC](https://ifnotnil.com/t/map-an-image-to-a-polygon/940/21 "2020-09-11T11:53:38Z")

</div>

Yes. At the time I took the screen shot I was just testing the basic principles of the matrix math & picture transform functions I wrote.

---

<div class="post-metadata">

**Author:** ![samRowlands](https://ifnotnil.com/user_avatar/ifnotnil.com/samrowlands/32/121_2.png) [@samRowlands](https://ifnotnil.com/u/samRowlands)\
**Post date:** [12 September 2020 03:44 UTC](https://ifnotnil.com/t/map-an-image-to-a-polygon/940/22 "2020-09-12T03:44:28Z")

</div>

Shame Apple’s killing OpenGL and Metal still isn’t a complete replacement for it. Woulda been nice if Apple kept up to date, mind you, that might have made OpenGL apps much faster than Metal… lol…

---

<div class="post-metadata">

**Author:** ![DaveS](https://ifnotnil.com/user_avatar/ifnotnil.com/daves/32/79_2.png) [@DaveS](https://ifnotnil.com/u/DaveS)\
**Post date:** [17 September 2020 17:37 UTC](https://ifnotnil.com/t/map-an-image-to-a-polygon/940/23 "2020-09-17T17:37:32Z")

</div>

Ok… I don’t want/need to do anything fancy like OpenGL etc… This is supposed to be a one-off program to create a series of static images (ie. isometric dice)

for the image I posted above I can map the ORANGE and CYAN faces with acceptable results… but am still having issues with the TOP (magenta)

I have a series of images (128x128) and the approach I am taking is to scan each image (RGBSurface) then take the X,Y coordinate and the pixel color and attemp to map it to the face.

Here is the code (there are 9 images, as the 2,3 and 6 are rotated in some renderings)

```auto
Public Sub make_dice(index as string, value as integer, face1 as integer, face2 as integer)
  Dim f As FolderItem
  Dim x As Integer
  Dim y As Integer
  Dim i As Integer
  Dim c As Color
  Dim face As Picture
  Dim face_r As RGBSurface
  p=New picture(dice_size*1.74,dice_size*2.5)
  face_dice=p.RGBSurface
  For i = 1 To 3
    Select Case i
    Case 1
      face=zGetImage(value)
    Case 2
      face=zGetImage(face1)
    Case 3
      face=zGetImage(face2)
    End Select
    //
    face_r=face.RGBSurface
    For x=0 To face.Width-1
      For y=0 To face.height-1
        c=face_r.Pixel(x,y)
        Select Case i
        Case 1
          zMapTop(x,y,c)
        Case 2
          zMapLeft(x,y,c) // this works
        Case 3
          zMapRight(x,y,c) // this works
        End Select
      Next y
    Next x
  Next i
  //
  Select Case value
  Case 7
    value=2
  Case 8
    value=3
  Case 9
    value=6
  End Select
  f=GetFolderItem("").child("dice"+Str(value)+index+".png")
  p.Save(f,picture.SaveAsPNG)
End Sub

Public Sub zMapLeft(old_x as double, old_y as double, c as color)
  // calculate new x,y
  Dim newX As Double
  Dim newY As Double
  newX = (p.width/2)-(old_x * Cos(angle))
  newY = (p.height)-(old_x*Sin(angle))-old_y
  face_dice.Pixel(newX,newY)=c
End Sub

Public Sub zMapRight(old_x as double, old_y as double, c as color)
  // calculate new x,y
  Dim newX As Double
  Dim newY As Double
  newX = (p.width/2)+(old_x * Cos(angle))
  newY = (p.height)-(old_x*Sin(angle))-old_y
  face_dice.Pixel(newX,newY)=c
End Sub

// THIS ONE IS WHERE THE PROBLEM IS
Public Sub zMapTop(old_x as double, old_y as double, c as color)
  // calculate new x,y
  Dim newX As Double
  Dim newY As Double
  Dim pcx As Double =(p.width/2)
  Dim cx As Double = pcx-old_X
  Dim cy As Double = pcx-old_y
  newX = (cx * Cos(angle) - cy * Sin(angle))+ pcx
  newY = (cy * Cos(angle) + cx * Sin(angle)) 
  //
  //newX=old_x
  //newY=old_y
  face_dice.Pixel(newX,newY)=c  
End Sub

```

Calling the above as

```auto
make_dice("A",1,2,3)

```

renders this image  
 ![dice1A](https://ifnotnil.com/uploads/default/original/1X/af041a2191a3de4084ecf4006610bd948ef94bce.png)

---

<div class="post-metadata">

**Author:** ![DaveS](https://ifnotnil.com/user_avatar/ifnotnil.com/daves/32/79_2.png) [@DaveS](https://ifnotnil.com/u/DaveS)\
**Post date:** [18 September 2020 17:14 UTC](https://ifnotnil.com/t/map-an-image-to-a-polygon/940/24 "2020-09-18T17:14:43Z")

</div>

Solved

> [@Isometeric Dice - an Xojo Program](https://ifnotnil.com/t/isometeric-dice-an-xojo-program/1036):
>
> For a Swift app I’m writing I needed renditions of a standard 6 sided dice show in all 24 possible combinations. Here is a program that will create these from scratch… create a folder, drop this app in and run it… This is provided AS-IS, NO SUPPORT, USE FOR YOUR OWN APPS etc… etc [www.rdsisemore.com/make\_dice.xojo\_xml\_project.zip](http://www.rdsisemore.com/make_dice.xojo_xml_project.zip) [dice3A]

![dice2B](https://ifnotnil.com/uploads/default/original/1X/e43361afc699e8fdbd3352369a88aca46e1e31f8.png)

---

<div class="post-metadata">

**Author:** ![JeffT](https://ifnotnil.com/letter_avatar_proxy/v4/letter/j/e95f7d/32.png) [@JeffT](https://ifnotnil.com/u/JeffT)\
**Post date:** [18 September 2020 17:50 UTC](https://ifnotnil.com/t/map-an-image-to-a-polygon/940/25 "2020-09-18T17:50:08Z")

</div>

That feels like a lot of work to get a set of dice images when you can get polished ones as a set for (usually) about $15

> **[Isometric Dice Set](https://www.freepik.com/premium-vector/isometric-dice-set_9041376.htm)**
>
> Discover thousands of Premium vectors available in AI and EPS formats

> **[Stock Vector - Dice icons set. Isometric set of dice vector icons for web...](https://www.alamy.com/dice-icons-set-isometric-set-of-dice-vector-icons-for-web-design-isolated-on-white-background-image333897935.html)**
>
> Download this stock vector: Dice icons set. Isometric set of dice vector icons for web design isolated on white background - 2AB6A67 from Alamy's library of millions of high resolution stock photos, illustrations and vectors.

Are you putting other images on, or was it just the dice faces?

---

<div class="post-metadata">

**Author:** ![DaveS](https://ifnotnil.com/user_avatar/ifnotnil.com/daves/32/79_2.png) [@DaveS](https://ifnotnil.com/u/DaveS)\
**Post date:** [18 September 2020 18:29 UTC](https://ifnotnil.com/t/map-an-image-to-a-polygon/940/26 "2020-09-18T18:29:10Z")

</div>

This is how I wanted to do it… I don’t spend money on things I can do myself 🙂

[Previous page](https://ifnotnil.com/t/map-an-image-to-a-polygon/940.md?page=1)