ThinkGeo.com    |     Documentation    |     Premium Support

Client API Documentation for Map Suite Web Edition

Is it possible for me to add more lines of codes to those javascript? 
 For example ZoomIn() 
 I can use the OnExtentChanged event to get content. But it will refresh the page and takes time. We try to use page method (ajax) to achieve this goal. Is this possible? 
  
 Thanks, 
  
 Wilson Jiang

 


Hi Wilson,
Yes, you guys can extend the these functions. Here as following is a demo:
 
<script language="javascript" type="text/javascript">
    ThinkGeo.prototype.yourFunction = function () {
        alert("add custom logic here");
    }
</script>
 
Please make sure adding these functions at the end of the “Body” tag.
Regarding OnExtentChanged event, I don’t think you need to implement it by yourself, you can find the corresponding client event from map’s property “OnClientExtentChanged”. Here is the sample:
 
Map1. OnClientExtentChanged = “clientFunction”;
 
Thanks,
Johnny

How can you use “Map1.ZoomToPrevousExtent();”. Normally you can access Map1 from server side code. In javascript we normally use the following code to get client ID and map. 
 var mapClientID = ‘<%= this.Map1.ClientID %>’; 
  var map = document.getElementById(mapClientID); 
  
 My code in asp is  
 <ThinkGeo:Map ID=“MapSAM” runat=“server” Height=“900” Width=“1200px”/> 
 <asp:Button ID=“Sub” runat=“server” OnClientClick=“MapSAM.ZoomToPrevousExtent();return false;” Text=“Restore to Previous Content” />

 I got “MapSAM undefined” error. I tried to use mapClientID.ZoomToPrevousExtent() or map.ZoomToPrevousExtent(). Neither works. Probably I did not understand the Overview section above. Thanks. Wilson

Wilson,




The code for “ZoomToPreviouseExtent” is ok. Also you can get the source code of ZoomToPrevioursExtent function in “func_GeoResource.axd”by debugging the application.  In that function, we search for the “NavigationHistory” control via mapParser to zoom to previous extent. Can you try the installation sample “NavigateTheMap/NavigationHistory.aspx” to check if there is any difference from yours?




I think there is no problem to get the map clientId, but the code “var map= document.getElementById(mapClientId)” just can get the DIV object which is used to host the map instead of the map object. To get the real map object, please use the code “var map = Map1.GetOpenLayersMap();” instead.


Thanks,

Johnny

 



Hi Thinkgeo, 
  
 Is there any addition to above API since 3.0? We are now into 4.5… 
  
  
 Regards, 
 Anil

 


Hi Anil,
There is nothing change for Client API from 3.0 to 4.5
PS:  Mapsuite WebEdition relys on OpenLayers, so you can use all APIs which provide by OpenLayers, and then we have updated Openlayers since we updated WebEdition to 4.5, that means there are some addition OpenLayers APIs you can use. The detail please refers to:
openlayers.org/
Thanks,
James

Hi,


I just tried to use Map1.GetCurrentExtent() Both were wrong. The correct function was getExtent(), which I found in the OpenLayers docs.



var tgMap = null;
var OnMapCreated = function(map) {
tgMap = map;
tgMap.events.register('moveend', null, mapMoved);
tgMap.events.register('zoomend', null, mapMoved);
}
function mapMoved() {
if (!tgMap) return;
var xt = tgMap.getExtent();
}

Perhaps the docs here needs updating ? Or be removed ?


Using Web Edition 5.5.111.0

 



Hello Lars I, 
  
 Thank you reporting this, we will update this docs. 
  
 We appreciate your help. 
  
 Regards, 
  
 Gary

Hi, 
  
 I’ve begun using the Ajax Controls Toolkit for my projects, as its mix of client-side and server-side implementation is almost perfect for me. 
  
 However, using ACT presents problems with the client-side implementation of Map Suite. There’s no “Map1” variable anymore for client-side operations. 
  
 ACT changes the controls names, which seem to affect your client-side code. If I put the map control into a TabPanel “tpMap” in a TabContainer “tcMain”, the client-side variable is suddenly named “tcMain_tpMap_Map1” instead. 
  
 I did try to utilize the “map” returned by OnMapCreated() (as seen in the example above), but that seems to be a pure OpenLayers map object, not your extended implementation, and so it lacks a method or two. 
  
 Is this a bug or is it wad ? 
  


 


Hi Lars I.,
Sorry for delay and any inconvenience this may cause.
The “Map1” here is the ClientID of the map, it’s wrapped as an instance of utility for operating the pure OpenLayers map object, maybe we should get a better name to avoid the confusion between utility name and the name of the pure map object. Technically, we should use ClientID instead of the Id of the map control, because maybe we add several map controls into a complicated WebControl, such as TabControl, with same id. In other words, on client side, the clientId of map represents the utility object, which is understand as “Map1” by us before.
The “OnMapCreated” and “OnMapCreating” means the pure OpenLayers map creating event, so that’s why you get like that.
Thanks.
Johnny 

 How do I refresh client map if client sends a message to server and changes extent on server side? Do I need to send extent back to client and use ZoomToExtent(extent)?



Hi Hotter, 
  
 After the extent changed on server side, you don’t need to do anything on client side and the map would be refresh automatically. Because the server side is responsible for saving the map status and the client side would recreate the map according to the response from the server. 
  
 Regards, 
 Edgar

 Well I cant make that happen. Maybe you could point where is the problem? My sample:



ChangeExtent_javascript.zip (143 KB)

Hotter, 



I found you were using the Ajax call at client which means the map would not refresh after a post back. So you are right, you need to refresh the map by using “ZoomToExtent(extent)” in the call back. 



And you sample code should be modified two places to do that. 

Server side method “RaiseCallbackEvent”: 

returnString = string.Format("{0},{1},{2},{3}", left, bottom, right, top); // not Map1.CurrentExtent.ToString(); 



Because the openlayers bounds string should look like “left, bottom, right, top” , but our RectangleShape string look like “left, top , right, bottom”. More details about openlayers bounds please see here



Client side method “receiveServerData”: 

function receiveServerData(param){ 

document.getElementById("Label1").innerHTML = param; 

var extent = OpenLayers.Bounds.fromString(param); 

Map1.ZoomToExtent(extent); 





Besides, you also can consider to finish partial refreshing with the help of UpdatePanel  like our sample does. In this way, you just change the extent at server side and our map will refresh automatically, so the above works can be skipped. 



Thanks, 

Edgar



 How do I get those "left, bottom, right, top" from RectangleShape?


I think I found it (rectangleShape.LowerLeftPoint.X, rectangleShape.LowerLeftPoint.Y, rectangleShape.UpperRightPoint.X, rectangleShape.UpperRightPoint.Y)



Yes you are right, if you have any other questions please let us know. 
  
 Regards, 
 Edgar

Can this possibly be updated ? or is there a link to this clientside function documentation somewhere ?

Hello Gregory, 
  
 Actually, this document just includes the basic functions which defined by Map Suite Web Edition. If we want to check more client APIs from Map Suite Web Edition, please pay more attentions to the func_GeoResource.axd js file, which was registered on the fly and includes all the useful functions in client side. 
  
 Besides, as the Map Suite Web Edition relies on Openlayers, we can find more client APIs which provide by OpenLayers. The online Openlayers APIs please refer to:  dev.openlayers.org/releases/OpenLayers-2.7/doc/apidocs/files/OpenLayers-js.html 
  
 Thanks, 
  
 Summer 


Hello Gregory, 
  
 Actually, this document just includes the basic functions which defined by Map Suite Web Edition. If we want to check more client APIs from Map Suite Web Edition, please pay more attentions to the func_GeoResource.axd js file, which was registered on the fly and includes all the useful functions in client side. 
  
 Besides, as the Map Suite Web Edition relies on Openlayers, we can find more client APIs which provide by OpenLayers. The online Openlayers APIs please refer to:  dev.openlayers.org/releases/OpenLayers-2.7/doc/apidocs/files/OpenLayers-js.html 
  
 Thanks, 
  
 Summer 


Hello Gregory, 
  
 Actually, this document just includes the basic functions which defined by Map Suite Web Edition. If we want to check more client APIs from Map Suite Web Edition, please pay more attentions to the func_GeoResource.axd js file, which was registered on the fly and includes all the useful functions in client side. 
  
 Besides, as the Map Suite Web Edition relies on Openlayers, we can find more client APIs which provide by OpenLayers. The online Openlayers APIs please refer to:  dev.openlayers.org/releases/OpenLayers-2.7/doc/apidocs/files/OpenLayers-js.html 
  
 Thanks, 
  
 Summer