| 提交 | 用户 | 时间 | ||
| 58d006 | 1 | GMaps.prototype.toImage = function(options) { |
| A | 2 | var options = options || {}, |
| 3 | static_map_options = {}; | |
| 4 | ||
| 5 | static_map_options['size'] = options['size'] || [this.el.clientWidth, this.el.clientHeight]; | |
| 6 | static_map_options['lat'] = this.getCenter().lat(); | |
| 7 | static_map_options['lng'] = this.getCenter().lng(); | |
| 8 | ||
| 9 | if (this.markers.length > 0) { | |
| 10 | static_map_options['markers'] = []; | |
| 11 | ||
| 12 | for (var i = 0; i < this.markers.length; i++) { | |
| 13 | static_map_options['markers'].push({ | |
| 14 | lat: this.markers[i].getPosition().lat(), | |
| 15 | lng: this.markers[i].getPosition().lng() | |
| 16 | }); | |
| 17 | } | |
| 18 | } | |
| 19 | ||
| 20 | if (this.polylines.length > 0) { | |
| 21 | var polyline = this.polylines[0]; | |
| 22 | ||
| 23 | static_map_options['polyline'] = {}; | |
| 24 | static_map_options['polyline']['path'] = google.maps.geometry.encoding.encodePath(polyline.getPath()); | |
| 25 | static_map_options['polyline']['strokeColor'] = polyline.strokeColor | |
| 26 | static_map_options['polyline']['strokeOpacity'] = polyline.strokeOpacity | |
| 27 | static_map_options['polyline']['strokeWeight'] = polyline.strokeWeight | |
| 28 | } | |
| 29 | ||
| 30 | return GMaps.staticMapURL(static_map_options); | |
| 31 | }; | |
| 32 | ||
| 33 | GMaps.staticMapURL = function(options){ | |
| 34 | var parameters = [], | |
| 35 | data, | |
| 36 | static_root = 'http://maps.googleapis.com/maps/api/staticmap'; | |
| 37 | ||
| 38 | if (options.url) { | |
| 39 | static_root = options.url; | |
| 40 | delete options.url; | |
| 41 | } | |
| 42 | ||
| 43 | static_root += '?'; | |
| 44 | ||
| 45 | var markers = options.markers; | |
| 46 | ||
| 47 | delete options.markers; | |
| 48 | ||
| 49 | if (!markers && options.marker) { | |
| 50 | markers = [options.marker]; | |
| 51 | delete options.marker; | |
| 52 | } | |
| 53 | ||
| 54 | var styles = options.styles; | |
| 55 | ||
| 56 | delete options.styles; | |
| 57 | ||
| 58 | var polyline = options.polyline; | |
| 59 | delete options.polyline; | |
| 60 | ||
| 61 | /** Map options **/ | |
| 62 | if (options.center) { | |
| 63 | parameters.push('center=' + options.center); | |
| 64 | delete options.center; | |
| 65 | } | |
| 66 | else if (options.address) { | |
| 67 | parameters.push('center=' + options.address); | |
| 68 | delete options.address; | |
| 69 | } | |
| 70 | else if (options.lat) { | |
| 71 | parameters.push(['center=', options.lat, ',', options.lng].join('')); | |
| 72 | delete options.lat; | |
| 73 | delete options.lng; | |
| 74 | } | |
| 75 | else if (options.visible) { | |
| 76 | var visible = encodeURI(options.visible.join('|')); | |
| 77 | parameters.push('visible=' + visible); | |
| 78 | } | |
| 79 | ||
| 80 | var size = options.size; | |
| 81 | if (size) { | |
| 82 | if (size.join) { | |
| 83 | size = size.join('x'); | |
| 84 | } | |
| 85 | delete options.size; | |
| 86 | } | |
| 87 | else { | |
| 88 | size = '630x300'; | |
| 89 | } | |
| 90 | parameters.push('size=' + size); | |
| 91 | ||
| 92 | if (!options.zoom && options.zoom !== false) { | |
| 93 | options.zoom = 15; | |
| 94 | } | |
| 95 | ||
| 96 | var sensor = options.hasOwnProperty('sensor') ? !!options.sensor : true; | |
| 97 | delete options.sensor; | |
| 98 | parameters.push('sensor=' + sensor); | |
| 99 | ||
| 100 | for (var param in options) { | |
| 101 | if (options.hasOwnProperty(param)) { | |
| 102 | parameters.push(param + '=' + options[param]); | |
| 103 | } | |
| 104 | } | |
| 105 | ||
| 106 | /** Markers **/ | |
| 107 | if (markers) { | |
| 108 | var marker, loc; | |
| 109 | ||
| 110 | for (var i=0; data=markers[i]; i++) { | |
| 111 | marker = []; | |
| 112 | ||
| 113 | if (data.size && data.size !== 'normal') { | |
| 114 | marker.push('size:' + data.size); | |
| 115 | delete data.size; | |
| 116 | } | |
| 117 | else if (data.icon) { | |
| 118 | marker.push('icon:' + encodeURI(data.icon)); | |
| 119 | delete data.icon; | |
| 120 | } | |
| 121 | ||
| 122 | if (data.color) { | |
| 123 | marker.push('color:' + data.color.replace('#', '0x')); | |
| 124 | delete data.color; | |
| 125 | } | |
| 126 | ||
| 127 | if (data.label) { | |
| 128 | marker.push('label:' + data.label[0].toUpperCase()); | |
| 129 | delete data.label; | |
| 130 | } | |
| 131 | ||
| 132 | loc = (data.address ? data.address : data.lat + ',' + data.lng); | |
| 133 | delete data.address; | |
| 134 | delete data.lat; | |
| 135 | delete data.lng; | |
| 136 | ||
| 137 | for(var param in data){ | |
| 138 | if (data.hasOwnProperty(param)) { | |
| 139 | marker.push(param + ':' + data[param]); | |
| 140 | } | |
| 141 | } | |
| 142 | ||
| 143 | if (marker.length || i === 0) { | |
| 144 | marker.push(loc); | |
| 145 | marker = marker.join('|'); | |
| 146 | parameters.push('markers=' + encodeURI(marker)); | |
| 147 | } | |
| 148 | // New marker without styles | |
| 149 | else { | |
| 150 | marker = parameters.pop() + encodeURI('|' + loc); | |
| 151 | parameters.push(marker); | |
| 152 | } | |
| 153 | } | |
| 154 | } | |
| 155 | ||
| 156 | /** Map Styles **/ | |
| 157 | if (styles) { | |
| 158 | for (var i = 0; i < styles.length; i++) { | |
| 159 | var styleRule = []; | |
| 160 | if (styles[i].featureType && styles[i].featureType != 'all' ) { | |
| 161 | styleRule.push('feature:' + styles[i].featureType); | |
| 162 | } | |
| 163 | ||
| 164 | if (styles[i].elementType && styles[i].elementType != 'all') { | |
| 165 | styleRule.push('element:' + styles[i].elementType); | |
| 166 | } | |
| 167 | ||
| 168 | for (var j = 0; j < styles[i].stylers.length; j++) { | |
| 169 | for (var p in styles[i].stylers[j]) { | |
| 170 | var ruleArg = styles[i].stylers[j][p]; | |
| 171 | if (p == 'hue' || p == 'color') { | |
| 172 | ruleArg = '0x' + ruleArg.substring(1); | |
| 173 | } | |
| 174 | styleRule.push(p + ':' + ruleArg); | |
| 175 | } | |
| 176 | } | |
| 177 | ||
| 178 | var rule = styleRule.join('|'); | |
| 179 | if (rule != '') { | |
| 180 | parameters.push('style=' + rule); | |
| 181 | } | |
| 182 | } | |
| 183 | } | |
| 184 | ||
| 185 | /** Polylines **/ | |
| 186 | function parseColor(color, opacity) { | |
| 187 | if (color[0] === '#'){ | |
| 188 | color = color.replace('#', '0x'); | |
| 189 | ||
| 190 | if (opacity) { | |
| 191 | opacity = parseFloat(opacity); | |
| 192 | opacity = Math.min(1, Math.max(opacity, 0)); | |
| 193 | if (opacity === 0) { | |
| 194 | return '0x00000000'; | |
| 195 | } | |
| 196 | opacity = (opacity * 255).toString(16); | |
| 197 | if (opacity.length === 1) { | |
| 198 | opacity += opacity; | |
| 199 | } | |
| 200 | ||
| 201 | color = color.slice(0,8) + opacity; | |
| 202 | } | |
| 203 | } | |
| 204 | return color; | |
| 205 | } | |
| 206 | ||
| 207 | if (polyline) { | |
| 208 | data = polyline; | |
| 209 | polyline = []; | |
| 210 | ||
| 211 | if (data.strokeWeight) { | |
| 212 | polyline.push('weight:' + parseInt(data.strokeWeight, 10)); | |
| 213 | } | |
| 214 | ||
| 215 | if (data.strokeColor) { | |
| 216 | var color = parseColor(data.strokeColor, data.strokeOpacity); | |
| 217 | polyline.push('color:' + color); | |
| 218 | } | |
| 219 | ||
| 220 | if (data.fillColor) { | |
| 221 | var fillcolor = parseColor(data.fillColor, data.fillOpacity); | |
| 222 | polyline.push('fillcolor:' + fillcolor); | |
| 223 | } | |
| 224 | ||
| 225 | var path = data.path; | |
| 226 | if (path.join) { | |
| 227 | for (var j=0, pos; pos=path[j]; j++) { | |
| 228 | polyline.push(pos.join(',')); | |
| 229 | } | |
| 230 | } | |
| 231 | else { | |
| 232 | polyline.push('enc:' + path); | |
| 233 | } | |
| 234 | ||
| 235 | polyline = polyline.join('|'); | |
| 236 | parameters.push('path=' + encodeURI(polyline)); | |
| 237 | } | |
| 238 | ||
| 239 | parameters = parameters.join('&'); | |
| 240 | return static_root + parameters; | |
| 241 | }; | |
