Panotour Pro 2 - 在Google Maps API v3中添加KML

时间:2015-01-11 18:34:34

标签: google-maps google-maps-api-3

我已经在Panotour中使用Google Maps API v3几天了,并且已经将我自己的KML图层添加到我的Panotour Maps中。我昨天工作了,但今天它似乎已经被打破了。

要添加我自己的KML图层,我基本上只是在" \ graphics \ KolorMap \ lib \ mxn.googlev3.core"下的项目构建中添加一段脚本。

这是我拼凑到googlev3.core文件中的代码块。它是来自开发者网站的KML示例。我想在添加自己的自定义内容之前让它工作。

var ctaLayer = new google.maps.KmlLayer({
  url: 'http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml'
});
ctaLayer.setMap(map);

我添加了一个指向mxn.googlev3.core的链接。如果有人知道我需要在哪里放置我的代码,或者我需要添加任何值得赞赏的东西。

mxn.googlev3.core

提前致谢

1 个答案:

答案 0 :(得分:0)

还有一些我正在整理的错误,我可能仍需要一些帮助。

以下是mxn.googlev3.core文件的代码摘录。代码是从第1行到第140行。我忘记了到底是因为我添加了自己的代码。

mxn.register('googlev3', {

Mapstraction: {

init: function(element, api){
    var me = this;

    if (typeof google.maps.Map === 'undefined') {
        throw new Error(api + ' map script not imported');
    }

    // by default add road map and no controls
    var myOptions = {
        disableDefaultUI: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControl: false,
        mapTypeControlOptions: null,
        zoomControl: false,
        zoomControlOptions: null,
        panControl: false,
        panControlOptions: null,
        scaleControl: false,
        scaleControlOptions: null,
        scrollwheel: true,
        draggable: false,
        disableDoubleClickZoom: true
    };

    // Background color can only be set at construction
    // To provide some control, adopt any explicit element style
    var backgroundColor = null;
    if ( element.currentStyle ) {
        backgroundColor = element.currentStyle['background-color'];
    }
    else if ( window.getComputedStyle ) {
        backgroundColor = document.defaultView.getComputedStyle(element, null).getPropertyValue('background-color');
    }
    // Only set the background if a style has been explicitly set, ruling out the "transparent" default
    if ( backgroundColor && 'transparent' !== backgroundColor ) {
        myOptions.backgroundColor = backgroundColor;
    }

    // find controls
    if (!this.addControlsArgs && loadoptions.addControlsArgs) {
        this.addControlsArgs = loadoptions.addControlsArgs;
    }
    if (this.addControlsArgs) {
        if (this.addControlsArgs.zoom) {
            myOptions.zoomControl = true;
            if (this.addControlsArgs.zoom == 'small') {
                myOptions.zoomControlOptions = {style: google.maps.ZoomControlStyle.SMALL,position: google.maps.ControlPosition.TOP_LEFT};
            }
            if (this.addControlsArgs.zoom == 'large') {
                myOptions.zoomControlOptions = {style: google.maps.ZoomControlStyle.LARGE,position: google.maps.ControlPosition.TOP_LEFT};
            }
        }
        if (this.addControlsArgs.scale) {
            myOptions.scaleControl = true;
            myOptions.scaleControlOptions = {style:google.maps.ScaleControlStyle.DEFAULT,position: google.maps.ControlPosition.BOTTOM_LEFT};
        }
        if (this.addControlsArgs.pan) {
            myOptions.panControl = true;
            myOptions.panControlOptions = {position: google.maps.ControlPosition.TOP_LEFT};
        }
        if (this.addControlsArgs.map_type) {
            myOptions.mapTypeControl = true;
            myOptions.mapTypeControlOptions = {style: google.maps.MapTypeControlStyle.DEFAULT,position: google.maps.ControlPosition.TOP_RIGHT};
        }
        if (this.addControlsArgs.overview) {
            myOptions.overviewMapControl = true;
            myOptions.overviewMapControlOptions = {opened: true};
        }
    }

    // Enable the visual refresh
    google.maps.visualRefresh = true;

    var map = new google.maps.Map(element, myOptions);

    var fireOnNextIdle = [];

    google.maps.event.addListener(map, 'idle', function() {
        var fireListCount = fireOnNextIdle.length;
        if (fireListCount > 0) {
            var fireList = fireOnNextIdle.splice(0, fireListCount);
            var handler;
            while((handler = fireList.shift())){
                handler();
            }
        }
    });

    // deal with click
    google.maps.event.addListener(map, 'click', function(location){
        me.click.fire({'location': 
            new mxn.LatLonPoint(location.latLng.lat(),location.latLng.lng())
        });
    });

    // deal with zoom change
    google.maps.event.addListener(map, 'zoom_changed', function(){
        // zoom_changed fires before the zooming has finished so we 
        // wait for the next idle event before firing our changezoom
        // so that method calls report the correct values
        fireOnNextIdle.push(function() {
            me.changeZoom.fire();
        });
    });

    // deal with map movement
    var is_dragging = false;
    google.maps.event.addListener(map, 'dragstart', function() {
        is_dragging = true;
    });
    google.maps.event.addListener(map, 'dragend', function(){
        me.moveendHandler(me);
        me.endPan.fire();
        is_dragging = false; 
    });

    google.maps.event.addListener(map, 'center_changed', function() {
        me.endPan.fire();
    });

    // deal with initial tile loading
    var loadListener = google.maps.event.addListener(map, 'tilesloaded', function(){
        me.load.fire();
        google.maps.event.removeListener( loadListener );
        if (!is_dragging) {
            fireOnNextIdle.push(function() {
                me.endPan.fire();
            });
        }
    });

    this.maps[api] = map;
    this.loaded[api] = true;

 // THIS IS THE KML CODE THAT YOU NEED TO INSERT -START

    var ctaLayer = new google.maps.KmlLayer({
        url: 'Insert your kml here link here'
    });
    ctaLayer.setMap(map);

 //END KML CODE SECTION

},

"在此处插入您的kml链接"是你放置你的kml网址链接的地方。

由于某种原因,属性会在间歇时间停止显示。他们将工作,然后我将再次点击一个功能来查看属性,什么也没有。这是其中一个错误。我还在弄乱kml要素属性表中的文档链接。随着我对此更深入了解,这个全景计划正在成为一个GIS计划。

如果有人对此有任何其他想法,请随时提出建议。