<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Wialon Playground - Get POIs</title>
    <script type="text/javascript" src="//code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript" src="//hst-api.wialon.com/wsdk/script/wialon.js"></script>
</head>
<body>

Resources: <select id="res"></select> POIS:<select id="pois"></select>
<div id="log"></div>

</body>
</html>HTML

#log {
  border: 1px solid #c6c6c6;
}CSS

// Print message to log
function msg(text) { $("#log").prepend(text + "<br/>"); }

function init() { // Execute after login succeed
    var sess = wialon.core.Session.getInstance(); // get instance of current Session
    // flags to specify what kind of data should be returned
	var flags = wialon.item.Item.dataFlag.base | wialon.item.Resource.dataFlag.poi;

	sess.loadLibrary("resourcePois"); // load POIs Library 
	sess.updateDataFlags( // load items to current session
		[{type: "type", data: "avl_resource", flags: flags, mode: 0}], // Items specification
		function (code) { // updateDataFlags callback
			if (code) { msg(wialon.core.Errors.getErrorText(code)); return; } // exit if error code 
           	var res = sess.getItems("avl_resource"); // get loaded 'avl_resource' items
        	if (!res || !res.length){ msg("No resources found"); return; } // check if resources found
	
        	for (var i = 0; i< res.length; i++) // construct Select list using found resources
        		$("#res").append("<option value='"+ res[i].getId() +"'>"+ res[i].getName() +"</option>");

            // bind actions to select change
        	$("#res").change( function(){ getPOIs(this.value); } );
	        $("#pois").change( function(){ getPoiInfo( $("#res").val(), this.value); } );
	});
}

function getPOIs( res_id ){ // get POIs for selected resource and construct Select list
	$("#pois").html("<option></option>"); // add first empty element
	if(res_id){ // check if resource id exists
		var res = wialon.core.Session.getInstance().getItem(res_id); // get Resource by id
		if(!res){ msg("Unknown resource id: "+res_id); return; } // check if resource found
		var pois = res.getPois(); // get POIs of resource
		var i = 0; // init variable
		for (i in pois) // construct Select list using found POIs
			$("#pois").append("<option value='" + pois[i].id + "'>" + pois[i].n + "</option>");
        // if no POI was appended to select list
		if(!i) // print no POI found message
		    msg("POIs not found for '"+ res.getName() +"'. Create it first");
		else // print found POI count
		    msg(i + " POIs found for '"+ res.getName() +"'.");
	}
}

function getPoiInfo(res_id, poi_id){ // get information about selected resource and POI
	if(!res_id || !poi_id) return; // check if resource and poi selected
	var res = wialon.core.Session.getInstance().getItem(res_id); // get Resource by id
	if(!res){ msg("Unknown resource id: "+res_id); return; } // check if resource found
	var poi = res.getPoi(poi_id); // get POI by id
	if(!res){ msg("Unknown POI id: "+poi_id); return; } // check if resource found
	var img = res.getPoiImageUrl(poi); // get poi icon
	// print POI information
	msg("<img src='"+ img +"' alt='icon'/> "+ poi.n + " selected");
}

// execute when DOM ready
$(document).ready(function (){
	wialon.core.Session.getInstance().initSession("https://hst-api.wialon.com"); // init session
    // For more info about how to generate token check
    // http://sdk.wialon.com/playground/demo/app_auth_token
	wialon.core.Session.getInstance().loginToken("5dce19710a5e26ab8b7b8986cb3c49e58C291791B7F0A7AEB8AFBFCEED7DC03BC48FF5F8", "", // try to login
	    function (code) { // login callback
	    	if (code){ msg(wialon.core.Errors.getErrorText(code)); return; } // exit if error code
	    	msg("Logged successfully"); init(); // when login suceed then run init() function
	});
});
JS

Result

Source code of example Close ✕