Example #1
0
  initialize: function(id) {
    var _this = this;

    this.map = L.map(id, { attributionControl: false });
    this.geojsonLayer = {};
    this.geomLayer = L.geoJson(null, {
      style: createStyle,
      pointToLayer: function(feature, latlng) {
        return L.circle(latlng, 24);
      },
      onEachFeature: function(f, layer) {
        _this.geojsonLayer[L.stamp(f)] = layer;
        featureControl(f, layer);
      }
    });

    L.tileLayer(config.tiles.url, {
      attribution: config.tiles.atttribution
    }).addTo(this.map);

    L.control.attribution({ position: 'bottomleft' }).addTo(this.map);

    this.geomLayer.addTo(this.map);
    this.map.setView([0, 0], 2);
    this.map.on('click', L.bind(function(e) { this.fire('click', e); }, this));
  },
Example #2
0
TerriaViewer.prototype.selectViewer = function(bCesium) {

    changeBaseMap(this, undefined);

    this.terria.beforeViewerChanged.raiseEvent();

    var map, viewer, rect, eventHelper;

    var that = this;

    if (!bCesium) {

            //shut down existing cesium
        if (defined(this.terria.cesium)) {
            viewer = this.terria.cesium.viewer;
            //get camera and timeline settings
            try {
                rect =  this.terria.cesium.getCurrentExtent();
            } catch (e) {
                console.log('Using default screen extent', e.message);
                rect =  this.terria.initialView.rectangle;
            }

            this.terria.cesium.destroy();

            if (that.cesiumEventHelper) {
                that.cesiumEventHelper.removeAll();
                that.cesiumEventHelper = undefined;
            }

            this.dataSourceDisplay.destroy();

            this._enableSelectExtent(viewer.scene, false);

            var inputHandler = viewer.screenSpaceEventHandler;
            inputHandler.removeInputAction( ScreenSpaceEventType.MOUSE_MOVE );
            inputHandler.removeInputAction( ScreenSpaceEventType.LEFT_DOUBLE_CLICK );
            inputHandler.removeInputAction( ScreenSpaceEventType.LEFT_DOUBLE_CLICK, KeyboardEventModifier.SHIFT );

            if (defined(this.monitor)) {
                this.monitor.destroy();
                this.monitor = undefined;
            }
            viewer.destroy();
        }
        else {
            rect =  this.terria.initialView.rectangle;
        }

       //create leaflet viewer
        map = L.map(this._mapContainer, {
            worldCopyJump: true,
            zoomControl: false,
            attributionControl: false,
            maxZoom: this.maximumLeafletZoomLevel
        }).setView([-28.5, 135], 5);

        map.attributionControl = L.control.attribution({
            position: 'bottomleft'
        });
        map.addControl(map.attributionControl);

        map.screenSpaceEventHandler = {
            setInputAction : function() {},
            remoteInputAction : function() {}
        };
        map.destroy = function() {};

        var leaflet = new Leaflet( this.terria, map);

        if (!defined(this.leafletVisualizer)) {
            this.leafletVisualizer = new LeafletVisualizer();
        }

        var d = this._getDisclaimer();
        if (d) {
            map.attributionControl.setPrefix('<span class="leaflet-disclaimer">' +
                (d.link ? '<a target="_blank" href="' + d.link + '">' : '') +
                d.text +
                (d.link ? '</a>' : '') +
                '</span>' +
                (this._developerAttribution && this._developerAttribution.link ? '<a target="_blank" href="' + this._developerAttribution.link + '">' : '') +
                (this._developerAttribution ? this._developerAttribution.text : '') +
                (this._developerAttribution && this._developerAttribution.link ? '</a>' : '') +
                (this._developerAttribution ? ' | ' : '') +
                '<a target="_blank" href="http://leafletjs.com/">Leaflet</a>' // partially to avoid a dangling leading comma issue
                );
        }

        map.on("boxzoomend", function(e) {
            console.log(e.boxZoomBounds);
        });

        this.terria.leaflet = leaflet;
        this.terria.cesium = undefined;
        this.terria.currentViewer =  this.terria.leaflet;

        this.dataSourceDisplay = new DataSourceDisplay({
            scene : leaflet.scene,
            dataSourceCollection : this.terria.dataSources,
            visualizersCallback: this.leafletVisualizer.visualizersCallback
        });

        eventHelper = new EventHelper();

        eventHelper.add(that.terria.clock.onTick, function(clock) {
            that.dataSourceDisplay.update(clock.currentTime);
        });

        this.leafletEventHelper = eventHelper;

        var ticker = function() {
            if (defined(that.terria.leaflet)) {
                that.terria.clock.tick();
                cesiumRequestAnimationFrame(ticker);
            }
        };

        ticker();

        this.terria.leaflet.zoomTo(rect, 0.0);
    }
    else {
        if (defined(this.terria.leaflet)) {
            map = this.terria.leaflet.map;
            rect =  this.terria.leaflet.getCurrentExtent();
            this.terria.leaflet.destroy();

            if (that.leafletEventHelper) {
                that.leafletEventHelper.removeAll();
                that.leafletEventHelper = undefined;
            }

            this.dataSourceDisplay.destroy();
            map.remove();
        }

        //create Cesium viewer
        viewer = this._createCesiumViewer(this._mapContainer);

        this._enableSelectExtent(viewer.scene, true);

        this.terria.cesium = new Cesium(this.terria, viewer);
        this.terria.leaflet = undefined;
        this.terria.currentViewer =  this.terria.cesium;

        //Simple monitor to start up and switch to 2D if seem to be stuck.
        if (!defined(this.checkedStartupPerformance)) {
            this.checkedStartupPerformance = true;
            var uri = new URI(window.location);
            var params = uri.search(true);
            var frameRate = (defined(params.fps)) ? params.fps : 5;

            this.monitor = new FrameRateMonitor({
                scene: viewer.scene,
                minimumFrameRateDuringWarmup: frameRate,
                minimumFrameRateAfterWarmup: 0,
                samplingWindow: 2
            });
            this.monitor.lowFrameRate.addEventListener( function() {
                if (! that.terria.cesium.stoppedRendering) {
                    PopupMessageViewModel.open(that._uiContainer, {
                        title : 'Unusually Slow Performance Detected',
                        message : '\
It appears that your system is capable of running '+that.terria.appName+' in 3D mode, but is having significant performance issues. \
We are automatically switching to 2D mode to help resolve this issue.  If you want to switch back to 3D mode you can select \
that option from the Maps button at the top of the screen.'
                    });
                    runLater(function() {
                        that.terria.viewerMode = ViewerMode.Leaflet;
                    });
                }
            });
        }

        eventHelper = new EventHelper();

        eventHelper.add(that.terria.clock.onTick, function(clock) {
            that.dataSourceDisplay.update(clock.currentTime);
        });

        this.cesiumEventHelper = eventHelper;

        this.dataSourceDisplay = new DataSourceDisplay({
            scene : viewer.scene,
            dataSourceCollection : this.terria.dataSources
        });

        if (defined(rect)) {
             this.terria.cesium.zoomTo(rect, 0.0);
        } else {
             this.terria.cesium.zoomTo( this.terria.initialView, 0.0);
        }
    }

    //redisplay timeline
    if (this.terria.showTimeline !== 0) {
        this.terria.showTimeline++;
    }

    this.terria.afterViewerChanged.raiseEvent();

    changeBaseMap(this,  this.terria.baseMap);

};
 componentWillMount () {
   this.leafletElement = control.attribution(this.props)
 }
 createLeafletElement(props: Object): Object {
   return control.attribution(props)
 }
Example #5
0
function createAndGetControls(options) {
    options = $.extend({
        domId: 'map'
    }, options);

    var mapOptions = {
        minZoom: zoom.MIN,
        maxZoom: zoom.MAX,
        attributionControl: false,
        zoomControl: false,
        maxBounds: L.latLngBounds(config.bounds[0], config.bounds[1]).pad(4)
    };
    if (options.static) {
        mapOptions.dragging = false;
        mapOptions.touchZoom = false;
        mapOptions.scrollWheelZoom = false;
        mapOptions.doubleClickZoom = false;
        mapOptions.boxZoom = false;
        mapOptions.tap = false;
    }

    var map = L.map(options.domId, mapOptions),
        // We have stretched the zoomControl and its "container" (which is
        // not its parent as once thought but rather its DOM element)
        // into a multi-purpose widget control. This is done by
        // instantiating a zoom control and then placing additional markup
        // in its DOM element for other controls. Subsequently, we
        // refer to it as the multiControl in order to hide this
        // implementation detail.
        multiControl = L.control.zoom({position: 'bottomleft'}).addTo(map),
        $multiControlContainer = $(multiControl.getContainer()),
        bounds = getDomMapAttribute('bounds', options.domId),
        mapLocation = getDomMapAttribute('location', options.domId),
        zoomSpec = getDomMapAttribute('zoom', options.domId);

    map.addControl(L.control.attribution({prefix: false}));

    if (bounds) {
        fitBounds(map, bounds);
    } else if (options.bounds) {
        map.fitBounds(options.bounds, {maxZoom: zoom.NEIGHBORHOOD});
    } else if (mapLocation) {
        var z = (zoomSpec === 'LOCATION' ? zoom.LOCATION : zoom.NEIGHBORHOOD);
        map.setView(mapLocation, z);
    } else if (options.location && options.location.lat !== 0) {
        map.setView(options.location, zoom.NEIGHBORHOOD);
    } else {
        map.fitBounds(config.bounds);
    }

    initBaseMap(map, options);

    if (options.geolocation && navigator.geolocation) {
        initGeolocation($multiControlContainer, map);
    }
    if (options.legend) {
        initLegend($multiControlContainer, map);
    }
    if (options.search) {
        initLocationSearch($multiControlContainer, map);
    }
    if (options.crosshairs) {
        initCrosshairs(options.domId);
    }
    if (options.static) {
        // We had to add zoomControl to find its container, but now remove it.
        multiControl.removeFrom(map);
    }

    return {map: map, multiControl: multiControl};
}