Unity rotation

How to rotate an object around its center in Unity

Unity and me

Hi to all. Today I add a new technology which one I have been working the last year. It’s Unity, a game engine that can make it quite easier to develop a common game, but at the same time Unity offers you a lot of powerful tools to enable you make more complex projects. Yooka-Laylee by Platonic Games is the most recent exaple of a big, famous and mainstream game done using this engine.

Actually I’m using the engine to create augmented reality applications for the company where I’m working at, ANSWARETECH. And while using it I’ve been getting stressed with many problems that I’ll be commenting in different posts.

Rotating the object

Ok, I’ll not extend more your wait. I was trying a way to rotate a 3D Obj that I’ve loaded dinamically from the Web using Simple .OBJ asset to a Vuforia Trackable Object in order to be able to display it in augmented reality over a marker.

After getting it I decided that it would be good if we could add some functionality to the GameObject so I started to add transformation buttons: scale+, scale-, rotateX, rotateY (sorry, not rotateZ).

But I found some problems in the results of the rotate functions. So  after trying some alternatives and playing with Transform.Rotate, Transform.RotateAround, Transform.rotation (Quaternions), I had the idea of using an empty GameObject as parent of my OBJ and position it on its center, this way I could rotate parent easily and avoid anchor problems of my not 0,0,0 located 3d model.

So I finally did it with the following code:

using UnityEngine;
using System.Collections;

// ...

public static class Load3D {

// ...

    public void loadModel() {
    // ... In my 3D loading function

        model.transform.parent = marker.transform; //model is my OBJ model. Marker is the Vuforia thing

        model.transform.rotation = new Quaternion(0,0,0,0); //Resets rotation after adding it to parent

        Vector3 objCenter = model.GetComponent<Renderer>().bounds.center;

        GameObject container = new GameObject(); //new blank parent for my model.

        container.transform.parent = marker.transform;

        container.transform.rotation = new Quaternion(0,0,0,0);

        container.transform.Position = objCenter;

        model.transform.parent = container.transform;
}

    public void RotateMyModel() {
        // ... In my rotation functionality
        model.transform.parent.Rotate(Vector.up * 90);
        //or
        model.transform.parent.Rotate(Vector.right * 90);
        //or
        model.transform.parent.Rotate(Vector.forward * 90);
    }
}

 

Well, and that’s all 🙂

I hope it helps someone and avoid some headaches.

Have a nice coding day!

 

Map and Reduce functions in JavaScript

Hi everyone, today I’m going to explain how to use two of the greatest functions to work with arrays in JavaScript: reduce and map. So let’s go to the example.

Array.prototype.map (callback [, thisArg])

Map is a function that allow us creating a new array result of operate with other array elements. The resulting array will have the same length as the original array.

The callback function has 3 args:

  • The current element in the array.
  • The index of the current element.
  • The full original array.

You can use thisArg to indicate which object will be used when you call this keyword in callback function.

Know this will allow us write a short example to show you how to use it:

 


var arr = [{a:5, b:2}, {a:7, b:1}, {a:2, b:7}, {a:12, b:6}];

var subtraction = arr.map(function( element, index, array) {
     return element.a - element.b;
});

console.log(subtraction); // Will show an array with [3, 6, -5, 6]

As you can see this array will have the same length as the original array used for map and the elements contained are the results from the return of callback function. Really simple and useful!

 

Array.prototype.reduce(callback [, initValue])

Reduce is a function which return a value after operating with all elements in an inputted array.

The callback function has 4 args:

  • Previous value
  • Actual value
  • The index of actual value
  • The full original array

You can use initValue arg to indicate which will be the first value of Previous value if no value is used then, in the first loop, Previous value will take the value of the first element of the original array, and Actual value will take the value of the second element. If initValue is used then the first loop will use it as Previous value and the first element of the array will be used as Actual value. The return value of this function can be any variable you want: a string, a number, an array, an object… You decide!

Let’s see an example,  this time we will generate an object counting the times that each character appears in a string:


var str = "Hello, this is just a reduce test!";
var strArr = str.split("");

var charCount = strArr.reduce(function( previousValue, actualValue, index, array) {
    if(previousValue[actualValue]){ 
      previousValue[actualValue]++; //if actual value has appeared in previous iterations just increase its value in our object
    } else { previousValue[actualValue] = 1; // else if it hasn't appeared yet just start count with "1" 
}
    return previousValue; //return previousValue for using it as previousValue in the next iteration 
}, {});  //We use an empty object as initialValue

console.log(charCount); // Will show in console something like "Object { H: 1, e: 4, l: 2, o: 1, ,: 1,  : 6, t: 4, h: 1, i: 2, s: 4, 7 more… }"

What a magic experience!

With this short post I hope you have understood correctly how this great functions work and now it only depends on what you do and how you use it in your awesome applications.

See you in future posts!