Layer with 1d icons, 2d images and 3d objects
In this third tutorial, we will explain how to include different POI representatives, namely 1d icon (CIW), 2d and 3d objects in a layer.
Links need to be checked out before following this tutorial:
- API documentation - objects and transform
- Howto - 2D and 3D objects
- 3D Model Converter
The changes made to implement 2d and 3d objects are:
- MySQL database - Add three tables to the database, namely "Icon", "Object" and "Transform". In table "POI", add three columns, "iconID", "objectID" and "transformID".
- PHP code - Add three functions "getIcon", "getObject" and "getTransform" to retrieve object and transform applied to the POI.
NOTE: These changes are made based on the sample code from the Second Tutorial - layer with Actions. It is a good idea to review the previous tutorials before moving on.
Modify Database Structure
- Create three separate tables for Object and Transform
Three tables are created to store Icon, Object and Transform dictionary defined in GetPOIs-JSON Response, namely "Icon", "Object" and "Transform". Each table has its own id field as primary key.

An example of how each table looks like is shown below:
- An example of one "icon" description in "Icon"
![]()
- An example of one object description in "Object"

- An example of one transformation in "Transform"

- Add three columns "objectID" and "transformID" to "POI" table.
- "iconID" - refers to the icon used to represent a POI. It is the icon id defined in "Icon" table.
- "objectID" - refers to the object used to represent a POI. It is the object id defined in "Object" table.
- "transformID" - refers to the transform applied to the object of a POI. It is the transform id defined in "Transform" table.

Create function getIcon to retrieve icon information assigned to a POI
- Use a SQL statement to retrieve icon dictionary that has the same "iconID" defined for the POI in POI table.
- Return $icon array which contains retrieved icon information.
// Put fetched icon dictionary for each POI into an associative array.
//
// Arguments:
// db ; The database connection handler.
// iconID, integer ; The iconID value which is stored in this POI.
//
// Return:
// array ; An associative array of retrieved icon dictionary for this POI.
// Otherwise, return NULL.
function getIcon($db, $iconID) {
// If no icon object is found, return NULL.
$icon = NULL;
// Run the query to retrieve icon information for this POI.
$sql_icon = $db->prepare( '
SELECT url, type
FROM Icon
WHERE id = :iconID
' );
$sql_icon->bindParam(':iconID', $iconID, PDO::PARAM_INT);
$sql_icon->execute();
$rawIcon = $sql_icon->fetch(PDO::FETCH_ASSOC);
// Assign returned values to $icon array.
if($rawIcon){
$rawIcon['type'] = changetoInt($rawIcon['type']);
$icon = $rawIcon;
}
return $icon;
}//getIcon
Create function getObject to retrieve object assigned to a POI
- Use a SQL statement to retrieve object that has the same "objectID" defined for the POI in POI table.
- Return $object array which contains retrieved object information.
// Put fetched object parameters for each POI into an associative array.
//
// Arguments:
// db ; The database connection handler.
// objectID, integer ; The object id assigned to this POI in the database.
//
// Returns:
// associative array or NULL ; An array of received object related parameters for
// this POI. otherwise, return NULL.
//
function getObject($db , $objectID) {
// If no object is found, return NULL.
$object = NULL;
// A new table called "Object" is created to store object related parameters,
// namely "url", "contentType", "reducedURL" and "size". The SQL statement
// returns object which has the same id as $objectID stored in this POI.
$sql_object = $db->prepare(
" SELECT contentType,
url,
reducedURL,
size
FROM Object
WHERE id = :objectID
LIMIT 0,1 ");
// Binds the named parameter marker ":objectID" to the specified parameter
// value $objectID.
$sql_object->bindParam(':objectID', $objectID, PDO::PARAM_INT);
// Use PDO::execute() to execute the prepared statement $sql_object.
$sql_object->execute();
// Fetch the poi object.
$rawObject = $sql_object->fetch(PDO::FETCH_ASSOC);
/* Process the $rawObject result */
// if $rawObject array is not empty.
if ($rawObject) {
// Change "size" type to float.
$rawObject['size'] = changetoFloat($rawObject['size']);
$object = $rawObject;
}
return $object;
}//getObject
Create function getTransform to retrieve transform applied to the POI
- Use a SQL statement to retrieve object that has the same "transformID" defined for the POI in POI table.
- Return $transform array which contains retrieved transform object information.
// Put fetched transform object for each POI into an associative array.
//
// Arguments:
// db ; The database connection handler.
// transformID , integer ; The transform id assigned to this POI in the database.
//
// Returns: associative array or NULL; An array of received transform related
// parameters for this POI. Otherwise, return NULL.
//
function getTransform($db , $transformID) {
// If no transform object found, return NULL.
$transform = NULL;
// A new table called "Transform" is created to store transform related
// parameters, namely "rotate","translate" and "scale".
// "transformID" is the transform that is applied to this POI.
// The SQL statement returns transform which has the same id as the
// $transformID of this POI.
$sql_transform = $db->prepare("
SELECT rel,
angle,
rotate_x,
rotate_y,
rotate_z,
translate_x,
translate_y,
translate_z,
scale
FROM Transform
WHERE id = :transformID
LIMIT 0,1 ");
// Binds the named parameter marker ":transformID" to the specified parameter
// value $transformID
$sql_transform->bindParam(':transformID', $transformID, PDO::PARAM_INT);
// Use PDO::execute() to execute the prepared statement $sql_transform.
$sql_transform->execute();
// Fetch the poi transform.
$rawTransform = $sql_transform->fetch(PDO::FETCH_ASSOC);
/* Process the $rawTransform result */
// if $rawTransform array is not empty
if ($rawTransform) {
// Change the value of "scale" into decimal value.
$transform['scale'] = changetoFloat($rawTransform['scale']);
// construct translate field
$transform['translate']['x'] =changetoFloat($rawTransform['translate_x']);
$transform['translate']['y'] = changetoFloat($rawTransform['translate_y']);
$transform['translate']['z'] = changetoFloat($rawTransform['translate_z']);
// construct rotate field
$transform['rotate']['axis']['x'] = changetoFloat($rawTransform['rotate_x']);
$transform['rotate']['axis']['y'] = changetoFloat($rawTransform['rotate_y']);
$transform['rotate']['axis']['z'] = changetoFloat($rawTransform['rotate_z']);
$transform['rotate']['angle'] = changetoFloat($rawTransform['angle']);
$transform['rotate']['rel'] = changetoBool($rawTransform['rel']);
}//if
return $transform;
}//getTransform
In function getHotspots, Added the following lines to retrieve relevant icon, object and transform for each POI
// Get object object information if iconID is not null if(count($rawPoi['iconID']) != 0) $poi['icon'] = getIcon($db , $rawPoi['iconID']); // Get object object information if objectID is not null if(count($rawPoi['objectID']) != 0) $poi['object'] = getObject($db, $rawPoi['objectID']); // Get transform object information if transformID is not null if(count($rawPoi['transformID']) != 0) $poi['transform'] = getTransform($db, $rawPoi['transformID']);
With this tutorial, you can already create a layer with actions and 3d objects enabled. Sample Code is attached.