htmlgui_api.js

Source:
Version:
  • 1.0
Author:
  • Guenter Richter guenter.richter@medienobjekte.de
Copyright:
  • CC BY SA
License:
  • MIT
This file provides iXmaps interface functions for HTML Pages that embed ixmaps maps

Examples

1. mode: embed the map by a dedicated frame and adress by the frame (and map) id

<!DOCTYPE html>
<html>
  <body>

    ...
    <iframe id="map" src="http://...map_source...">
    ...

    <script type="text/javascript" src = "../../ui/js/htmlgui_api.js" > </script>

    <script type="text/javascript" charset="utf-8">

      // wait for map ready
      // ----------------------------
      ixmaps.waitForMap("map",function() {

        ixmaps.setView("map",[42.79540065303723,13.20831298828125],9);

        ixmaps.newTheme("map","Totale complessivo",{  
          layer: "com2011_s",
          field: "Totale complessivo",
          style: {
            type: "CHOROPLETH|EQUIDISTANT",
            colorscheme: [  "5","#FFFDD8","#B5284B","2colors","#FCBA6C" ],
            dbtable: "themeDataObj csv url(http://mysite/mydata/data.csv)",
            lookupfield: "comune"
            },"clear"
          });
      });

    </script>
  </body>
</html>
2. mode: embed the map by ixmaps api function and adress by the returned map handle

<!DOCTYPE html>
<html>
  <body>
    <div id="map_div"></div>

    <script type="text/javascript" src = "../../ui/js/htmlgui_api.js" > </script>
    <script type="text/javascript" charset="utf-8">

    ixmaps.embedMap("map_div",
      { 
         mapName:    "map", 
         mapService: "leaflet",
         mapType:    "OpenStreetMap - FR"
      },
      function(map) {

        map.setView([42.79540065303723,13.20831298828125],9);

        map.newTheme("Totale complessivo",
          {  
          layer: "com2011_s",
          field: "Totale complessivo",
          style: {
            type: "CHOROPLETH|EQUIDISTANT",
            colorscheme: [  "5","#FFFDD8","#B5284B","2colors","#FCBA6C" ],
            dbtable: "themeDataObj csv url(http://mysite/mydata/data.csv)",
            lookupfield: "comune"
            }
          },"clear");
        }
      );

    </script>
  </body>
</html>