<<< Torna alla lista degli esempi

Working with logger directive

Example how to work with logger directive
Source code:
		
  <link rel="stylesheet" href="js/example_logger.css">
  <div>        
    <!--  Sezione mappa -->
    <section style="overflow: hidden; border: 1px;">
      <div>
        <!-- Sezione TOC-->
        <div ng-controller="toccontroller" style="float:left; border: 1px; width: 20%; height: 500px; padding: 10px; border-radius: 5px; margin: auto; border: 1px solid gray;">
          <toc-directive mapid="mappa1" template='js/template/toc.html'></toc-directive>
        </div>

        <!--  Sezione MAPPA -->
        <div ng-controller="maphistorycontroller" style="float:left; border: 1px; width: 80%;" >
          <map-directive  id="mappa1" center="activeCenter" width="100%" height='500' template='js/template/map.html'>
            <osm-layer-directive 
              order=0 
              classname="layerosm" 
              name="OSM"  
              opacity="0.5"
            ></osm-layer-directive>
            <geojson-layer-directive 
              order=1 name="geoJson" 
              classname="layergeojson"  
              opacity="0.7" 
              visible="true"  
              url="js/data/json/countries.json" 
              styles="js/style/geoJsonStyle.json"
            ></geojson-layer-directive>
            <wkt-layer-directive 
              order=3 
              name="Wkt" 
              classname="layerwkt"  
              url="js/data/wkt/wktData" 
              projection="EPSG:3857" 
              styles='js/style/gpxStyle.json'
            ></wkt-layer-directive>
            <gpx-layer-directive
              order=2
              name="gpxlayer" 
              classname="layergpx"  
              url="js/data/gpx/rome.gpx" 
              styles='js/style/gpxStyle.json'
            ></gpx-layer-directive>
            <kml-layer-directive 
              order=4 
              name="Kml" 
              url="js/data/kml/earthquakes.kml" 
              styles="js/style/gpxStyle.json"
            ></kml-layer-directive>
          </map-directive>          
        </div>
      </div>
    </section>

    <!--  Sezione LOGGER -->
    <section style="overflow: hidden; border: 1px;">
      <div style="overflow: hidden; padding: 10px;">
        <fire-logger-directive template="js/template/logMessage.html"></fire-logger-directive>
        <fire-log-viewer-directive mapid="mappa1" layer="gpxlayer" minlevel="fire.widget.directive.log.LEVEL.FATAL" template="js/template/logConsole.html"></fire-log-viewer-directive>
      </div>
    </section>
  </div>




var onload = function(){
};

var options = {
     modules : [fire.Modules.WIDGET]
    ,otherScripts : []
    ,mode : fire.Mode.BUILD
    ,relative: "../lib/fire/"
};
fire.require(onload, options);


//******************EXAMPLE*************
var exampleJson = {"type":"FeatureCollection","features":[{"type":"Feature","geometry":{"type":"Point","coordinates":[1134908.4594877376,5483055.791204744]},"properties":null},{"type":"Feature","geometry":{"type":"Point","coordinates":[1169152.2481594966,5321620.7874664515]},"properties":null},{"type":"Feature","geometry":{"type":"Point","coordinates":[1350155.1311387946,5140617.904487154]},"properties":null},{"type":"Feature","geometry":{"type":"LineString","coordinates":[[944121.6368879382,5453703.972343236],[1100664.6708159787,5189537.602589667],[1315911.3424670356,5238457.30069218],[1312498.2662075984,5364741.122291358],[1311019.3726567845,5419460.183671477]]},"properties":null},{"type":"Feature","geometry":{"type":"Polygon","coordinates":[[[1361166.5324871414,5366056.480839454],[1551953.3550869417,5092106.171465382],[1850363.51351227,5092106.171465382],[1561737.294707444,5473679.816664982],[1361166.5324871414,5366056.480839454]]]},"properties":null}]};
//*********************************************
	
Output:
<<< Torna alla lista degli esempi