Adding objects to map

From Ka-Map Wiki

Contents 1 Overlay API Reference 2 Adding Map Object Examples 2.1 Example 2.2 Example - using xml point data file

[edit] Overlay API Reference

• Overlay API Reference
• Overlay Api Discussion - object overlay discussion

[edit] Adding Map Object Examples

[edit] Example

To add an image or other object to the map, insert something like the following code into startUp.js, just before 'drawPage();' - located around line 60:

var canvas = myKaMap.createDrawingCanvas( 500 ); //zindex=500
var img = document.createElement( 'img' );
img.src = 'images/kamap.gif';
myKaMap.addObjectGeo( canvas, lon, lat, img )

[edit] Example - using xml point data file

This may save you some time to using the overlay approach. Overlay API Reference

1. Insert this section into index_overlay.html after the other js includes because they are not included as of CVS 3.0.

     <script type="text/javascript" src="excanvas.js"></script>
     <script type="text/javascript" src="wz_jsgraphics.js"></script>
     <script type="text/javascript" src="XMLOverlay/kaXmlOverlay.js"></script>
   

2. setup overlay insert this section into startup_overlay.js after the line

    //look for this code in startup_overlay.js around line 125-130
    myKaMap.initialize( map, extents, cps ); 
   

    //be sure to have this line of code (this may come before myKaMap.initialize(...
    myXmlOverlay = new kaXmlOverlay( myKaMap, 250 );
   

3. xml -> this is an xml document, be sure to replace x and y with coordinates that match your map extent and you can use a different pointid like "P1"

    //add this code to load the points xml file with point data to overlay
    myXmlOverlay.loadXml('/ka-map/points.php');
   

   this is a sample of my points.php xml doc

     <?php
     header("Content-Type: text/xml");
     header("Cache-Control: no-store, no-cache, must-revalidate");
     echo '<?xml version="1.0" encoding="UTF-8"?>'
     ?>
     <xml>
       <overlay>
         <point x="1320359.18446697" y="435142.745613481" id="31051000401200">
           <label>1.34ac</label>
           <symbol shape="bullet" size="10" opacity="1" color="#FF0000" />
         </point>
       </overlay>
     </xml>