Skip to end of metadata
Go to start of metadata

The purpose of this section of the User Guide is to explain how to go about adding MapBuilder to a web page and what the individual parts achieve.

There are several common steps for coding a MapBuilder application: your HTML page includes a JavaScript library which opens and reads a configuration file in the BODY onload event. In the following code examples, paths starting with "/" are relative to your server root, otherwise they are relative to the web page's base URL.

1. Create your configuration file: Reference the configuration file in the web page's <HEAD> element. This variable must be named "mbConfigUrl".

2. Include the MapBuilder JavaScript library: the web page's <HEAD> element must include a reference to the MapBuilder library JavaScript code. The library must be installed on the same server as the page using it:

3. Initialize the application: the page's BODY onload event handler must call MapBuilder's body onload event handler.

There are ways that other BODY onload event handlers can be called as well.

4. Create the HTML for the web page: Assign an ID attribute to the HTML elements in the page where MapBuilder widget output will be inserted. For example:

where "mbId" corresponds to a widget ID in your configuration file.

You can see the whole thing put together in the MapBuilder Simple and Basic Demos which are also good examples to copy as a starting point for your own applications. Be sure to inspect the source code for the demo and it's configuration file.

When developing an application, it's best to keep your application code separate from the MapBuilder codebase so that you can update your MapBuilder installation without affecting your application.  The only requirement is that MapBuilder and your application must share the same domain name.  If you need to customize a widget XSL file, copy the default MapBuilder XSL file to your application directory and referece it using the <stylesheet> property in the configuration file.


  • No labels