Google maps 将多段线添加到Google Maps数据层

在我的应用程序中，我正在将GeoJSON文件加载到Google地图中。文件加载正确，没有问题，但我希望应用多段线对象而不是要素对象固有的其他样式。我想做的是设置线条字符串的样式，使其包含多个图标和一条虚线。我读过关于GeoJSON和虚线的文章，它是有效的，但我不希望多段线是单个实体；我希望渲染的多段线位于一个对象数据层中。我正在努力实现的目标可能吗？有解决办法吗

**更新**

我使用了geocodezip中的代码，并将其修改为一个工厂，有两种类型：标记和多段线

function LayerFactory() {
this.entities = [];
this.labelLayerName = "";
}

LayerFactory.prototype.layerType = PolylineLayer;
LayerFactory.prototype = new google.maps.MVCObject();
LayerFactory.prototype.changed = function (key) {
    if (this.entities) {
        for (var i = 0; i < this.entities.length; i++) {
            this.entities[i].overlay.set(key, this.get(key));
        }
    }
};
LayerFactory.prototype.addEntity = function (entity) {
    this.entities.push(entity);

    if (this.layerType === PolylineLayer) {
        for (var i = 0; i < entity.overlays.length; i++) {
            var overlay = entity.overlays[i];
            //add events here
        }
    }
    else if (this.layerType === MarkerLayer) {
        //add events here
    }
};
LayerFactory.prototype.setMap = function (map) { this.set('map', map); };
LayerFactory.prototype.getMap = function () { return this.get('map'); };
LayerFactory.prototype.createLayer = function (options) {
    this.labelLayerName = options.labelLayerName;

    switch (options.layerType) {
        case "polyline":
            //set options
            break;
        case "marker":
            //set options
            break;
        case "label":
            //set options
            break;
    }

    return new this.layerType(options);

};

现在，在切换图层时，我只需拉动所需图层并将贴图设置为null/gmap：

yourMapLayer.setMap(/* gmap OR null => show/hide */);

我希望这能帮助那些经历过我的问题的人。祝你好运。

一些来自包含多条多段线的MVCObject的代码，它像多边形一样采用路径数组。不知道它是否适用于虚线

/**
 * A MultiGeometry object that will allow multiple polylines in a MultiGeometry
 * containing LineStrings to be treated as a single object
 *
 * @param {MutiGeometryOptions} anonymous object.  Available properties:
 * map: The map on which to attach the MultiGeometry
 * paths: the individual polylines
 * polylineOptions: options to use when constructing all the polylines
 *
 * @constructor
 */
// only if Google Maps API included
if (!!window.google && !! google.maps) { 
function MultiGeometry(multiGeometryOptions) {
   function createPolyline(polylineOptions, mg) {
     var polyline = new google.maps.Polyline(polylineOptions);
     google.maps.event.addListener(polyline,'click', function(evt) { google.maps.event.trigger(mg,'click',evt);});
     google.maps.event.addListener(polyline,'dblclick', function(evt) { google.maps.event.trigger(mg, 'dblclick', evt);});
     google.maps.event.addListener(polyline,'mousedown', function(evt) { google.maps.event.trigger(mg, 'mousedown', evt);});
     google.maps.event.addListener(polyline,'mousemove', function(evt) { google.maps.event.trigger(mg, 'mousemove', evt);});
     google.maps.event.addListener(polyline,'mouseout', function(evt) { google.maps.event.trigger(mg, 'mouseout', evt);});
     google.maps.event.addListener(polyline,'mouseover', function(evt) { google.maps.event.trigger(mg, 'mouseover', evt);});
     google.maps.event.addListener(polyline,'mouseup', function(evt) { google.maps.event.trigger(mg, 'mouseup', evt);});
     google.maps.event.addListener(polyline,'rightclick', function(evt) { google.maps.event.trigger(mg, 'rightclick', evt);});
     return polyline;
   }
   this.setValues(multiGeometryOptions);
   this.polylines = [];

   for (i=0; i<this.paths.length;i++) {
     var polylineOptions = multiGeometryOptions;
     polylineOptions.path = this.paths[i];
     var polyline = createPolyline(polylineOptions,this);
     // Bind the polyline properties to the MultiGeometry properties
     this.polylines.push(polyline);
   }
}
MultiGeometry.prototype = new google.maps.MVCObject();
MultiGeometry.prototype.changed = function(key) {
    // alert(key+" changed");
    if (this.polylines) {
        for (var i=0; i<this.polylines.length; i++) {
            this.polylines[i].set(key,this.get(key));
        }
    }
};
MultiGeometry.prototype.setMap = function(map) { this.set('map',map); };
MultiGeometry.prototype.getMap = function() { return this.get('map'); };
}

---

进一步研究后，“多重几何体”对象仅对多段线进行分组？我希望将它们作为单个实体，但放在一个容器中。基本上，我想要与数据层相同的行为，但使用多段线而不是特征。geocodezip，我是否能够使用基类MVCObject并以与MultiGeometry对象类似的方式使用它，但有单独的多段线？我不确定这意味着什么。如果您要发布一个演示您的问题的，我可能可以将其应用到您的代码中。MultiGeometry对象的目的是允许将一组单独的多段线作为一个控制。我修改了代码以接受多种类型，并将自定义对象绑定到类型polyline、marker、，等。当最终用户单击地图对象时，我现在可以作为功能访问属性，包括切换整个图层多重几何体。感谢您输入地理代码。

/**
 * A MultiGeometry object that will allow multiple polylines in a MultiGeometry
 * containing LineStrings to be treated as a single object
 *
 * @param {MutiGeometryOptions} anonymous object.  Available properties:
 * map: The map on which to attach the MultiGeometry
 * paths: the individual polylines
 * polylineOptions: options to use when constructing all the polylines
 *
 * @constructor
 */
// only if Google Maps API included
if (!!window.google && !! google.maps) { 
function MultiGeometry(multiGeometryOptions) {
   function createPolyline(polylineOptions, mg) {
     var polyline = new google.maps.Polyline(polylineOptions);
     google.maps.event.addListener(polyline,'click', function(evt) { google.maps.event.trigger(mg,'click',evt);});
     google.maps.event.addListener(polyline,'dblclick', function(evt) { google.maps.event.trigger(mg, 'dblclick', evt);});
     google.maps.event.addListener(polyline,'mousedown', function(evt) { google.maps.event.trigger(mg, 'mousedown', evt);});
     google.maps.event.addListener(polyline,'mousemove', function(evt) { google.maps.event.trigger(mg, 'mousemove', evt);});
     google.maps.event.addListener(polyline,'mouseout', function(evt) { google.maps.event.trigger(mg, 'mouseout', evt);});
     google.maps.event.addListener(polyline,'mouseover', function(evt) { google.maps.event.trigger(mg, 'mouseover', evt);});
     google.maps.event.addListener(polyline,'mouseup', function(evt) { google.maps.event.trigger(mg, 'mouseup', evt);});
     google.maps.event.addListener(polyline,'rightclick', function(evt) { google.maps.event.trigger(mg, 'rightclick', evt);});
     return polyline;
   }
   this.setValues(multiGeometryOptions);
   this.polylines = [];

   for (i=0; i<this.paths.length;i++) {
     var polylineOptions = multiGeometryOptions;
     polylineOptions.path = this.paths[i];
     var polyline = createPolyline(polylineOptions,this);
     // Bind the polyline properties to the MultiGeometry properties
     this.polylines.push(polyline);
   }
}
MultiGeometry.prototype = new google.maps.MVCObject();
MultiGeometry.prototype.changed = function(key) {
    // alert(key+" changed");
    if (this.polylines) {
        for (var i=0; i<this.polylines.length; i++) {
            this.polylines[i].set(key,this.get(key));
        }
    }
};
MultiGeometry.prototype.setMap = function(map) { this.set('map',map); };
MultiGeometry.prototype.getMap = function() { return this.get('map'); };
}