New Map Component: Setting the Center Longitude and Latitude in the Pre Execution

[dataguy12]

As I query the database for the set of Longitude and Latitude coordinates to display the markers, I'd like to set one of these as the center of the map.
I figure I can do this by writing a function in the pre-Execution hook.

My question is how do I refer to the NewMapComponent in a function?
And are there centerLongitude and centerLatitude properties I can set the values into?

[pamval]

yes, center latitude and longitude are properties of the map component. You can set them from CDE.

In pre-execution, you can do this.centerLatitude = <something> (I'm not sure if the exact property names are centerLatitude and centerLongitude, so inspect the object to make sure).

[Erdnusse]

Hi,

I'm having some difficulty trying to set the center dynamically. I checked the mapComponent.js and found the initPosLat and initPosLon, but it's not working. I have very little knowledge about this subject still. The code I used in pre execution :

function f() {


this.initPosLat = 41.1395599;
this.initPosLon= -8.55291423;


}

Any help would be amazing

UPDATE:

I believe i checked the wrong JavaScript for the component. Using this.centerLatitude and this.centerLongitude will solve the issue thank you!

function f(){
//debugger;


this.centerLatitude = 41.1395599;
this.centerLongitude= -8.55291423;


}

[crusso]

The file "mapComponent.js" refers to CDF's old map component, which is not what you are using.

On the NewMapComponent you can set the center latitude/longitude in the following ways:

1) within preExecution, which runs before any query takes place, you can set:

this.centerLatitude = 38.660294;
this.centerLongitude = -9.298992;

2) within postFetch, which has access to your data, you can set:

function(json){

// assuming a data layout of "latitude,longitude,...."
var latitudeList = _.pluck(json.resultset, 0);
var longitudeList = _.pluck(json.resultset, 1);

var centerLat = _.reduce(latitudeList, function(agg, value){ return agg + value;}, 0) / latitudeList.length
var centerLon = _.reduce(longitudeList, function(agg, value){ return agg + value;}, 0) / longitudeList.length

this.configuration.viewport.center = {
  latitude: centerLat,
  longitude: centerLon
}

return json;
}

The reason for the two mechanisms is that the component builds a "this.configuration" object immediately after preExecution. This allows grouping and cross-validation of options, as well as proper conciliation with the default settings.

[Erdnusse]

Thank you very much, this gives me a much better understanding of how these components work

Cheers!

The file "mapComponent.js" refers to CDF's old map component, which is not what you are using.

On the NewMapComponent you can set the center latitude/longitude in the following ways:

1) within preExecution, which runs before any query takes place, you can set:

this.centerLatitude = 38.660294;
this.centerLongitude = -9.298992;

2) within postFetch, which has access to your data, you can set:

function(json){

// assuming a data layout of "latitude,longitude,...."
var latitudeList = _.pluck(json.resultset, 0);
var longitudeList = _.pluck(json.resultset, 1);

var centerLat = _.reduce(latitudeList, function(agg, value){ return agg + value;}, 0) / latitudeList.length
var centerLon = _.reduce(longitudeList, function(agg, value){ return agg + value;}, 0) / longitudeList.length

this.configuration.viewport.center = {
  latitude: centerLat,
  longitude: centerLon
}

return json;
}

The reason for the two mechanisms is that the component builds a "this.configuration" object immediately after preExecution. This allows grouping and cross-validation of options, as well as proper conciliation with the default settings.