├── LICENSE ├── README.md ├── css ├── buttons.css ├── images │ ├── layers-2x.png │ ├── layers.png │ ├── marker-icon-2x.png │ ├── marker-icon.png │ ├── marker-shadow.png │ ├── spritesheet-2x.png │ ├── spritesheet.png │ └── spritesheet.svg ├── leaflet.css ├── leaflet.draw-src.css ├── leaflet.label.css ├── sweetalert.css └── sweetalert2.min.css ├── img ├── 1.jpg ├── 2.jpg ├── 3.jpg └── 4.png ├── index.html └── js ├── L.LabelTextCollision.js ├── Leaflet.Illustrate.js ├── _leaflet.draw-src.js ├── images ├── marker-icon-2x.png ├── marker-icon.png └── marker-shadow.png ├── jquery.min.js ├── leaflet-src.js ├── leaflet.draw-src.js ├── leaflet.draw.lang.zh-cn.js ├── leaflet.label.js ├── pinyinUtil.js ├── pinyin_dict_firstletter.js ├── sweetalert.min.js └── sweetalert2.min.js /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 DomeiGanbatte 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | #### 实现热点图像区域编辑功能,能够在图片上绘制、编辑、删除图形区域以及文字说明。 2 | ![](https://o7y8mvdbc.qnssl.com/tc/uploads/1708/111107364455.png) 3 | 4 | ### 使用 5 | [leaflet](https://github.com/Leaflet/Leaflet "leaflet")(v0.7.7)
6 | [leaflet.draw](https://github.com/Leaflet/Leaflet.draw "leaflet.draw")(v0.4.9)
7 | [leaflet.label](https://github.com/Leaflet/Leaflet.label "leaflet.label")
8 | [sweetalert2](https://github.com/limonte/sweetalert2 "sweetalert2")
9 | [pinyinjs](https://github.com/sxei/pinyinjs "pinyinjs")
10 | [jquery](https://github.com/jquery/jquery "jquery")(v3.1.1) 11 | ### Demo 12 | [http://demo.laji.blog/hotspots](http://demo.laji.blog/hotspots "http://demo.laji.blog/hotspots") 13 | ### Github 14 | [https://github.com/xiaomai0830/leaflet-image-hotspots](https://github.com/xiaomai0830/leaflet-image-hotspots "https://github.com/xiaomai0830/leaflet-image-hotspots") 15 | 16 | ###遇到的各种问题的解决方法和解答出处
17 | #### 1.用代码添加了一个多边形但是无法通过点击工具栏来编辑的原因
18 | 应该addTo(drawnItems)而不是addTo(map)
19 | [https://github.com/Leaflet/Leaflet.draw/issues/159](https://github.com/Leaflet/Leaflet.draw/issues/159 "https://github.com/Leaflet/Leaflet.draw/issues/159")
20 | ![](https://o7y8mvdbc.qnssl.com/tc/uploads/1708/111053399162.png) 21 | ![](https://o7y8mvdbc.qnssl.com/tc/uploads/1708/111054029615.png) 22 | #### 2.leaflet在使用CRS.Simple坐标时画圆的问题 23 | 添加以下代码: 24 | ```javascript 25 | L.Edit.Circle.include({ 26 | _move: function (latlng) { 27 | var resizemarkerPoint = this._getResizeMarkerPoint(latlng); 28 | 29 | // Move the resize marker 30 | this._resizeMarkers[0].setLatLng(resizemarkerPoint); 31 | 32 | // Move the circle 33 | this._shape.setLatLng(latlng); 34 | 35 | // output the radius, for debugging purpose. 36 | document.getElementById("radius").innerHTML = this._shape._radius; 37 | } 38 | }); 39 | // Correct Leaflet L.Circle for use with flat map. Comment the following function to see the original impact on radius when the circle is dragged along the vertical axis. 40 | L.Circle.include({ 41 | _getLngRadius: function () { 42 | return this._getLatRadius(); 43 | } 44 | }); 45 | ``` 46 | [https://stackoverflow.com/questions/29366268/leaflet-circle-drawing-editing-issue](https://stackoverflow.com/questions/29366268/leaflet-circle-drawing-editing-issue "https://stackoverflow.com/questions/29366268/leaflet-circle-drawing-editing-issue") 47 | ![](https://o7y8mvdbc.qnssl.com/tc/uploads/1708/111056432901.png)
48 | [http://jsfiddle.net/jameslaneconkling/mhpd9ca5](http://jsfiddle.net/jameslaneconkling/mhpd9ca5 "http://jsfiddle.net/jameslaneconkling/mhpd9ca5") 49 | #### 3.leaflet 添加文字的方法 50 | **方法一**:通过修改Marker的icon来实现
51 | [https://stackoverflow.com/questions/41082236/leafletjs-l-divicon-html-marker-text-scale-relative-to-map-zoom](https://stackoverflow.com/questions/41082236/leafletjs-l-divicon-html-marker-text-scale-relative-to-map-zoom "https://stackoverflow.com/questions/41082236/leafletjs-l-divicon-html-marker-text-scale-relative-to-map-zoom") 52 | 53 | **方法二**:添加以下代码(参照别人的代码改的,但在画polygon的时候会出现无法使用setText方法的问题,后来改用include就可以了): 54 | ```javascript 55 | //添加文字 56 | var original_getPathString_circle = L.Circle.prototype.getPathString; 57 | L.Circle.include({ 58 | getPathString: function () { 59 | var center = this._point, 60 | r = this._radius; 61 | if (this._textNode && this._textNode.parentNode) { 62 | this._path.parentNode.removeChild(this._textNode); 63 | delete this._textNode; 64 | } 65 | var textNode = L.Path.prototype._createElement('text'); 66 | 67 | textNode.setAttribute('text-anchor', 'middle'); 68 | textNode.setAttribute('style', 'font-weight:bold'); 69 | textNode.setAttribute('x', center.x); 70 | textNode.setAttribute('y', center.y); 71 | var font_size; 72 | if(this._map.getZoom()>0){ 73 | font_size = (textFontSize_default+4) * this._map.getZoom()*2; 74 | }else{ 75 | font_size = textFontSize_default; 76 | } 77 | textNode.setAttribute('font-size', font_size ); 78 | 79 | textNode.appendChild(document.createTextNode((this.text)?this.text:'')); 80 | 81 | this._path.parentNode.appendChild(textNode); 82 | 83 | this._textNode = textNode; 84 | 85 | return original_getPathString_circle.call(this); 86 | 87 | }, 88 | setText: function (text) { 89 | this.text = text; 90 | return this.redraw(); 91 | } 92 | 93 | }); 94 | 95 | var original_getPathString_rectangle = L.Rectangle.prototype.getPathString; 96 | L.Rectangle.include({ 97 | getPathString: function () { 98 | var center = map.latLngToLayerPoint(this.getBounds().getCenter()); 99 | if (this._textNode && this._textNode.parentNode) { 100 | this._path.parentNode.removeChild(this._textNode); 101 | delete this._textNode; 102 | } 103 | var textNode = L.Path.prototype._createElement('text'); 104 | 105 | textNode.setAttribute('text-anchor', 'middle'); 106 | textNode.setAttribute('style', 'font-weight:bold'); 107 | textNode.setAttribute('x', center.x); 108 | textNode.setAttribute('y', center.y); 109 | var font_size; 110 | if(this._map.getZoom()>0){ 111 | font_size = (textFontSize_default+4) * this._map.getZoom()*2; 112 | }else{ 113 | font_size = textFontSize_default; 114 | } 115 | textNode.setAttribute('font-size', font_size ); 116 | 117 | textNode.appendChild(document.createTextNode((this.text)?this.text:'')); 118 | 119 | this._path.parentNode.appendChild(textNode); 120 | 121 | this._textNode = textNode; 122 | 123 | return original_getPathString_rectangle.call(this); 124 | 125 | }, 126 | setText: function (text) { 127 | this.text = text; 128 | return this.redraw(); 129 | } 130 | 131 | }); 132 | 133 | 134 | var original_getPathString_polygon = L.Polygon.prototype.getPathString; 135 | L.Polygon.include({ 136 | getPathString: function () { 137 | var center = map.latLngToLayerPoint(this.getBounds().getCenter()); 138 | if (this._textNode && this._textNode.parentNode) { 139 | this._path.parentNode.removeChild(this._textNode); 140 | delete this._textNode; 141 | } 142 | var textNode = L.Path.prototype._createElement('text'); 143 | textNode.setAttribute('text-anchor', 'middle'); 144 | textNode.setAttribute('style', 'font-weight:bold'); 145 | textNode.setAttribute('x', center.x); 146 | textNode.setAttribute('y', center.y); 147 | var font_size; 148 | if(this._map.getZoom()>0){ 149 | font_size = (textFontSize_default+4) * this._map.getZoom()*2; 150 | }else{ 151 | font_size = textFontSize_default; 152 | } 153 | textNode.setAttribute('font-size', font_size ); 154 | 155 | textNode.appendChild(document.createTextNode((this.text)?this.text:'')); 156 | 157 | this._path.parentNode.appendChild(textNode); 158 | 159 | this._textNode = textNode; 160 | 161 | return original_getPathString_polygon.call(this); 162 | 163 | }, 164 | setText: function (text) { 165 | this.text = text; 166 | return this.redraw(); 167 | } 168 | 169 | }); 170 | ``` 171 | [https://stackoverflow.com/questions/39367040/can-i-have-fixed-text-in-leaflet](https://stackoverflow.com/questions/39367040/can-i-have-fixed-text-in-leaflet "https://stackoverflow.com/questions/39367040/can-i-have-fixed-text-in-leaflet")
172 | ![](https://o7y8mvdbc.qnssl.com/tc/uploads/1708/111050102672.png) 173 | #### 4.leaflet 获取图形的中心点 174 | Circle可直接用_point属性,Rectangle、Polygon要用map.latLngToLayerPoint(this.getBounds().getCenter())来获取。
175 | [https://stackoverflow.com/questions/13316925/simple-label-on-a-leaflet-geojson-polygon](https://stackoverflow.com/questions/13316925/simple-label-on-a-leaflet-geojson-polygon "https://stackoverflow.com/questions/13316925/simple-label-on-a-leaflet-geojson-polygon")
176 | ![](https://o7y8mvdbc.qnssl.com/tc/uploads/1708/111104051809.png) 177 | -------------------------------------------------------------------------------- /css/buttons.css: -------------------------------------------------------------------------------- 1 | .btn { 2 | display: inline-block; 3 | padding: 6px 12px; 4 | margin-bottom: 0; 5 | font-size: 24px; 6 | font-weight: normal; 7 | line-height: 1.42857143; 8 | text-align: center; 9 | white-space: nowrap; 10 | vertical-align: middle; 11 | -ms-touch-action: manipulation; 12 | touch-action: manipulation; 13 | cursor: pointer; 14 | -webkit-user-select: none; 15 | -moz-user-select: none; 16 | -ms-user-select: none; 17 | user-select: none; 18 | background-image: none; 19 | border: 1px solid transparent; 20 | border-radius: 4px; 21 | } 22 | .btn:focus, 23 | .btn:active:focus, 24 | .btn.active:focus, 25 | .btn.focus, 26 | .btn:active.focus, 27 | .btn.active.focus { 28 | outline: thin dotted; 29 | outline: 5px auto -webkit-focus-ring-color; 30 | outline-offset: -2px; 31 | } 32 | .btn:hover, 33 | .btn:focus, 34 | .btn.focus { 35 | color: #333; 36 | text-decoration: none; 37 | } 38 | .btn:active, 39 | .btn.active { 40 | background-image: none; 41 | outline: 0; 42 | -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 43 | box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 44 | } 45 | .btn.disabled, 46 | .btn[disabled], 47 | fieldset[disabled] .btn { 48 | cursor: not-allowed; 49 | filter: alpha(opacity=65); 50 | -webkit-box-shadow: none; 51 | box-shadow: none; 52 | opacity: .65; 53 | } 54 | a.btn.disabled, 55 | fieldset[disabled] a.btn { 56 | pointer-events: none; 57 | } 58 | .btn-default { 59 | color: #333; 60 | background-color: #fff; 61 | border-color: #ccc; 62 | } 63 | .btn-default:focus, 64 | .btn-default.focus { 65 | color: #333; 66 | background-color: #e6e6e6; 67 | border-color: #8c8c8c; 68 | } 69 | .btn-default:hover { 70 | color: #333; 71 | background-color: #e6e6e6; 72 | border-color: #adadad; 73 | } 74 | .btn-default:active, 75 | .btn-default.active, 76 | .open > .dropdown-toggle.btn-default { 77 | color: #333; 78 | background-color: #e6e6e6; 79 | border-color: #adadad; 80 | } 81 | .btn-default:active:hover, 82 | .btn-default.active:hover, 83 | .open > .dropdown-toggle.btn-default:hover, 84 | .btn-default:active:focus, 85 | .btn-default.active:focus, 86 | .open > .dropdown-toggle.btn-default:focus, 87 | .btn-default:active.focus, 88 | .btn-default.active.focus, 89 | .open > .dropdown-toggle.btn-default.focus { 90 | color: #333; 91 | background-color: #d4d4d4; 92 | border-color: #8c8c8c; 93 | } 94 | .btn-default:active, 95 | .btn-default.active, 96 | .open > .dropdown-toggle.btn-default { 97 | background-image: none; 98 | } 99 | .btn-default.disabled:hover, 100 | .btn-default[disabled]:hover, 101 | fieldset[disabled] .btn-default:hover, 102 | .btn-default.disabled:focus, 103 | .btn-default[disabled]:focus, 104 | fieldset[disabled] .btn-default:focus, 105 | .btn-default.disabled.focus, 106 | .btn-default[disabled].focus, 107 | fieldset[disabled] .btn-default.focus { 108 | background-color: #fff; 109 | border-color: #ccc; 110 | } 111 | .btn-default .badge { 112 | color: #fff; 113 | background-color: #333; 114 | } 115 | .btn-primary { 116 | color: #fff; 117 | background-color: #337ab7; 118 | border-color: #2e6da4; 119 | } 120 | .btn-primary:focus, 121 | .btn-primary.focus { 122 | color: #fff; 123 | background-color: #286090; 124 | border-color: #122b40; 125 | } 126 | .btn-primary:hover { 127 | color: #fff; 128 | background-color: #286090; 129 | border-color: #204d74; 130 | } 131 | .btn-primary:active, 132 | .btn-primary.active, 133 | .open > .dropdown-toggle.btn-primary { 134 | color: #fff; 135 | background-color: #286090; 136 | border-color: #204d74; 137 | } 138 | .btn-primary:active:hover, 139 | .btn-primary.active:hover, 140 | .open > .dropdown-toggle.btn-primary:hover, 141 | .btn-primary:active:focus, 142 | .btn-primary.active:focus, 143 | .open > .dropdown-toggle.btn-primary:focus, 144 | .btn-primary:active.focus, 145 | .btn-primary.active.focus, 146 | .open > .dropdown-toggle.btn-primary.focus { 147 | color: #fff; 148 | background-color: #204d74; 149 | border-color: #122b40; 150 | } 151 | .btn-primary:active, 152 | .btn-primary.active, 153 | .open > .dropdown-toggle.btn-primary { 154 | background-image: none; 155 | } 156 | .btn-primary.disabled:hover, 157 | .btn-primary[disabled]:hover, 158 | fieldset[disabled] .btn-primary:hover, 159 | .btn-primary.disabled:focus, 160 | .btn-primary[disabled]:focus, 161 | fieldset[disabled] .btn-primary:focus, 162 | .btn-primary.disabled.focus, 163 | .btn-primary[disabled].focus, 164 | fieldset[disabled] .btn-primary.focus { 165 | background-color: #337ab7; 166 | border-color: #2e6da4; 167 | } 168 | .btn-primary .badge { 169 | color: #337ab7; 170 | background-color: #fff; 171 | } 172 | .btn-success { 173 | color: #fff; 174 | background-color: #5cb85c; 175 | border-color: #4cae4c; 176 | } 177 | .btn-success:focus, 178 | .btn-success.focus { 179 | color: #fff; 180 | background-color: #449d44; 181 | border-color: #255625; 182 | } 183 | .btn-success:hover { 184 | color: #fff; 185 | background-color: #449d44; 186 | border-color: #398439; 187 | } 188 | .btn-success:active, 189 | .btn-success.active, 190 | .open > .dropdown-toggle.btn-success { 191 | color: #fff; 192 | background-color: #449d44; 193 | border-color: #398439; 194 | } 195 | .btn-success:active:hover, 196 | .btn-success.active:hover, 197 | .open > .dropdown-toggle.btn-success:hover, 198 | .btn-success:active:focus, 199 | .btn-success.active:focus, 200 | .open > .dropdown-toggle.btn-success:focus, 201 | .btn-success:active.focus, 202 | .btn-success.active.focus, 203 | .open > .dropdown-toggle.btn-success.focus { 204 | color: #fff; 205 | background-color: #398439; 206 | border-color: #255625; 207 | } 208 | .btn-success:active, 209 | .btn-success.active, 210 | .open > .dropdown-toggle.btn-success { 211 | background-image: none; 212 | } 213 | .btn-success.disabled:hover, 214 | .btn-success[disabled]:hover, 215 | fieldset[disabled] .btn-success:hover, 216 | .btn-success.disabled:focus, 217 | .btn-success[disabled]:focus, 218 | fieldset[disabled] .btn-success:focus, 219 | .btn-success.disabled.focus, 220 | .btn-success[disabled].focus, 221 | fieldset[disabled] .btn-success.focus { 222 | background-color: #5cb85c; 223 | border-color: #4cae4c; 224 | } 225 | .btn-success .badge { 226 | color: #5cb85c; 227 | background-color: #fff; 228 | } 229 | .btn-info { 230 | color: #fff; 231 | background-color: #5bc0de; 232 | border-color: #46b8da; 233 | } 234 | .btn-info:focus, 235 | .btn-info.focus { 236 | color: #fff; 237 | background-color: #31b0d5; 238 | border-color: #1b6d85; 239 | } 240 | .btn-info:hover { 241 | color: #fff; 242 | background-color: #31b0d5; 243 | border-color: #269abc; 244 | } 245 | .btn-info:active, 246 | .btn-info.active, 247 | .open > .dropdown-toggle.btn-info { 248 | color: #fff; 249 | background-color: #31b0d5; 250 | border-color: #269abc; 251 | } 252 | .btn-info:active:hover, 253 | .btn-info.active:hover, 254 | .open > .dropdown-toggle.btn-info:hover, 255 | .btn-info:active:focus, 256 | .btn-info.active:focus, 257 | .open > .dropdown-toggle.btn-info:focus, 258 | .btn-info:active.focus, 259 | .btn-info.active.focus, 260 | .open > .dropdown-toggle.btn-info.focus { 261 | color: #fff; 262 | background-color: #269abc; 263 | border-color: #1b6d85; 264 | } 265 | .btn-info:active, 266 | .btn-info.active, 267 | .open > .dropdown-toggle.btn-info { 268 | background-image: none; 269 | } 270 | .btn-info.disabled:hover, 271 | .btn-info[disabled]:hover, 272 | fieldset[disabled] .btn-info:hover, 273 | .btn-info.disabled:focus, 274 | .btn-info[disabled]:focus, 275 | fieldset[disabled] .btn-info:focus, 276 | .btn-info.disabled.focus, 277 | .btn-info[disabled].focus, 278 | fieldset[disabled] .btn-info.focus { 279 | background-color: #5bc0de; 280 | border-color: #46b8da; 281 | } 282 | .btn-info .badge { 283 | color: #5bc0de; 284 | background-color: #fff; 285 | } 286 | .btn-warning { 287 | color: #fff; 288 | background-color: #f0ad4e; 289 | border-color: #eea236; 290 | } 291 | .btn-warning:focus, 292 | .btn-warning.focus { 293 | color: #fff; 294 | background-color: #ec971f; 295 | border-color: #985f0d; 296 | } 297 | .btn-warning:hover { 298 | color: #fff; 299 | background-color: #ec971f; 300 | border-color: #d58512; 301 | } 302 | .btn-warning:active, 303 | .btn-warning.active, 304 | .open > .dropdown-toggle.btn-warning { 305 | color: #fff; 306 | background-color: #ec971f; 307 | border-color: #d58512; 308 | } 309 | .btn-warning:active:hover, 310 | .btn-warning.active:hover, 311 | .open > .dropdown-toggle.btn-warning:hover, 312 | .btn-warning:active:focus, 313 | .btn-warning.active:focus, 314 | .open > .dropdown-toggle.btn-warning:focus, 315 | .btn-warning:active.focus, 316 | .btn-warning.active.focus, 317 | .open > .dropdown-toggle.btn-warning.focus { 318 | color: #fff; 319 | background-color: #d58512; 320 | border-color: #985f0d; 321 | } 322 | .btn-warning:active, 323 | .btn-warning.active, 324 | .open > .dropdown-toggle.btn-warning { 325 | background-image: none; 326 | } 327 | .btn-warning.disabled:hover, 328 | .btn-warning[disabled]:hover, 329 | fieldset[disabled] .btn-warning:hover, 330 | .btn-warning.disabled:focus, 331 | .btn-warning[disabled]:focus, 332 | fieldset[disabled] .btn-warning:focus, 333 | .btn-warning.disabled.focus, 334 | .btn-warning[disabled].focus, 335 | fieldset[disabled] .btn-warning.focus { 336 | background-color: #f0ad4e; 337 | border-color: #eea236; 338 | } 339 | .btn-warning .badge { 340 | color: #f0ad4e; 341 | background-color: #fff; 342 | } 343 | .btn-danger { 344 | color: #fff; 345 | background-color: #d9534f; 346 | border-color: #d43f3a; 347 | } 348 | .btn-danger:focus, 349 | .btn-danger.focus { 350 | color: #fff; 351 | background-color: #c9302c; 352 | border-color: #761c19; 353 | } 354 | .btn-danger:hover { 355 | color: #fff; 356 | background-color: #c9302c; 357 | border-color: #ac2925; 358 | } 359 | .btn-danger:active, 360 | .btn-danger.active, 361 | .open > .dropdown-toggle.btn-danger { 362 | color: #fff; 363 | background-color: #c9302c; 364 | border-color: #ac2925; 365 | } 366 | .btn-danger:active:hover, 367 | .btn-danger.active:hover, 368 | .open > .dropdown-toggle.btn-danger:hover, 369 | .btn-danger:active:focus, 370 | .btn-danger.active:focus, 371 | .open > .dropdown-toggle.btn-danger:focus, 372 | .btn-danger:active.focus, 373 | .btn-danger.active.focus, 374 | .open > .dropdown-toggle.btn-danger.focus { 375 | color: #fff; 376 | background-color: #ac2925; 377 | border-color: #761c19; 378 | } 379 | .btn-danger:active, 380 | .btn-danger.active, 381 | .open > .dropdown-toggle.btn-danger { 382 | background-image: none; 383 | } 384 | .btn-danger.disabled:hover, 385 | .btn-danger[disabled]:hover, 386 | fieldset[disabled] .btn-danger:hover, 387 | .btn-danger.disabled:focus, 388 | .btn-danger[disabled]:focus, 389 | fieldset[disabled] .btn-danger:focus, 390 | .btn-danger.disabled.focus, 391 | .btn-danger[disabled].focus, 392 | fieldset[disabled] .btn-danger.focus { 393 | background-color: #d9534f; 394 | border-color: #d43f3a; 395 | } 396 | .btn-danger .badge { 397 | color: #d9534f; 398 | background-color: #fff; 399 | } 400 | -------------------------------------------------------------------------------- /css/images/layers-2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/css/images/layers-2x.png -------------------------------------------------------------------------------- /css/images/layers.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/css/images/layers.png -------------------------------------------------------------------------------- /css/images/marker-icon-2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/css/images/marker-icon-2x.png -------------------------------------------------------------------------------- /css/images/marker-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/css/images/marker-icon.png -------------------------------------------------------------------------------- /css/images/marker-shadow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/css/images/marker-shadow.png -------------------------------------------------------------------------------- /css/images/spritesheet-2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/css/images/spritesheet-2x.png -------------------------------------------------------------------------------- /css/images/spritesheet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/css/images/spritesheet.png -------------------------------------------------------------------------------- /css/images/spritesheet.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /css/leaflet.css: -------------------------------------------------------------------------------- 1 | /* required styles */ 2 | 3 | .leaflet-map-pane, 4 | .leaflet-tile, 5 | .leaflet-marker-icon, 6 | .leaflet-marker-shadow, 7 | .leaflet-tile-pane, 8 | .leaflet-tile-container, 9 | .leaflet-overlay-pane, 10 | .leaflet-shadow-pane, 11 | .leaflet-marker-pane, 12 | .leaflet-popup-pane, 13 | .leaflet-overlay-pane svg, 14 | .leaflet-zoom-box, 15 | .leaflet-image-layer, 16 | .leaflet-layer { 17 | position: absolute; 18 | left: 0; 19 | top: 0; 20 | } 21 | .leaflet-container { 22 | overflow: hidden; 23 | -ms-touch-action: none; 24 | touch-action: none; 25 | } 26 | .leaflet-tile, 27 | .leaflet-marker-icon, 28 | .leaflet-marker-shadow { 29 | -webkit-user-select: none; 30 | -moz-user-select: none; 31 | user-select: none; 32 | -webkit-user-drag: none; 33 | } 34 | .leaflet-marker-icon, 35 | .leaflet-marker-shadow { 36 | display: block; 37 | } 38 | /* map is broken in FF if you have max-width: 100% on tiles */ 39 | .leaflet-container img { 40 | max-width: none !important; 41 | } 42 | /* stupid Android 2 doesn't understand "max-width: none" properly */ 43 | .leaflet-container img.leaflet-image-layer { 44 | max-width: 15000px !important; 45 | } 46 | .leaflet-tile { 47 | filter: inherit; 48 | visibility: hidden; 49 | } 50 | .leaflet-tile-loaded { 51 | visibility: inherit; 52 | } 53 | .leaflet-zoom-box { 54 | width: 0; 55 | height: 0; 56 | } 57 | /* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */ 58 | .leaflet-overlay-pane svg { 59 | -moz-user-select: none; 60 | } 61 | 62 | .leaflet-tile-pane { z-index: 2; } 63 | .leaflet-objects-pane { z-index: 3; } 64 | .leaflet-overlay-pane { z-index: 4; } 65 | .leaflet-shadow-pane { z-index: 5; } 66 | .leaflet-marker-pane { z-index: 6; } 67 | .leaflet-popup-pane { z-index: 7; } 68 | 69 | .leaflet-vml-shape { 70 | width: 1px; 71 | height: 1px; 72 | } 73 | .lvml { 74 | behavior: url(#default#VML); 75 | display: inline-block; 76 | position: absolute; 77 | } 78 | 79 | 80 | /* control positioning */ 81 | 82 | .leaflet-control { 83 | position: relative; 84 | z-index: 7; 85 | pointer-events: auto; 86 | } 87 | .leaflet-top, 88 | .leaflet-bottom { 89 | position: absolute; 90 | z-index: 1000; 91 | pointer-events: none; 92 | } 93 | .leaflet-top { 94 | top: 0; 95 | } 96 | .leaflet-right { 97 | right: 0; 98 | } 99 | .leaflet-bottom { 100 | bottom: 0; 101 | } 102 | .leaflet-left { 103 | left: 0; 104 | } 105 | .leaflet-control { 106 | float: left; 107 | clear: both; 108 | } 109 | .leaflet-right .leaflet-control { 110 | float: right; 111 | } 112 | .leaflet-top .leaflet-control { 113 | margin-top: 10px; 114 | } 115 | .leaflet-bottom .leaflet-control { 116 | margin-bottom: 10px; 117 | } 118 | .leaflet-left .leaflet-control { 119 | margin-left: 10px; 120 | } 121 | .leaflet-right .leaflet-control { 122 | margin-right: 10px; 123 | } 124 | 125 | 126 | /* zoom and fade animations */ 127 | 128 | .leaflet-fade-anim .leaflet-tile, 129 | .leaflet-fade-anim .leaflet-popup { 130 | opacity: 0; 131 | -webkit-transition: opacity 0.2s linear; 132 | -moz-transition: opacity 0.2s linear; 133 | -o-transition: opacity 0.2s linear; 134 | transition: opacity 0.2s linear; 135 | } 136 | .leaflet-fade-anim .leaflet-tile-loaded, 137 | .leaflet-fade-anim .leaflet-map-pane .leaflet-popup { 138 | opacity: 1; 139 | } 140 | 141 | .leaflet-zoom-anim .leaflet-zoom-animated { 142 | -webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1); 143 | -moz-transition: -moz-transform 0.25s cubic-bezier(0,0,0.25,1); 144 | -o-transition: -o-transform 0.25s cubic-bezier(0,0,0.25,1); 145 | transition: transform 0.25s cubic-bezier(0,0,0.25,1); 146 | } 147 | .leaflet-zoom-anim .leaflet-tile, 148 | .leaflet-pan-anim .leaflet-tile, 149 | .leaflet-touching .leaflet-zoom-animated { 150 | -webkit-transition: none; 151 | -moz-transition: none; 152 | -o-transition: none; 153 | transition: none; 154 | } 155 | 156 | .leaflet-zoom-anim .leaflet-zoom-hide { 157 | visibility: hidden; 158 | } 159 | 160 | 161 | /* cursors */ 162 | 163 | .leaflet-clickable { 164 | cursor: pointer; 165 | } 166 | .leaflet-container { 167 | cursor: -webkit-grab; 168 | cursor: -moz-grab; 169 | } 170 | .leaflet-popup-pane, 171 | .leaflet-control { 172 | cursor: auto; 173 | } 174 | .leaflet-dragging .leaflet-container, 175 | .leaflet-dragging .leaflet-clickable { 176 | cursor: move; 177 | cursor: -webkit-grabbing; 178 | cursor: -moz-grabbing; 179 | } 180 | 181 | 182 | /* visual tweaks */ 183 | 184 | .leaflet-container { 185 | background: #ddd; 186 | outline: 0; 187 | } 188 | .leaflet-container a { 189 | color: #0078A8; 190 | } 191 | .leaflet-container a.leaflet-active { 192 | outline: 2px solid orange; 193 | } 194 | .leaflet-zoom-box { 195 | border: 2px dotted #38f; 196 | background: rgba(255,255,255,0.5); 197 | } 198 | 199 | 200 | /* general typography */ 201 | .leaflet-container { 202 | font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif; 203 | } 204 | 205 | 206 | /* general toolbar styles */ 207 | 208 | .leaflet-bar { 209 | box-shadow: 0 1px 5px rgba(0,0,0,0.65); 210 | border-radius: 4px; 211 | } 212 | .leaflet-bar a, 213 | .leaflet-bar a:hover { 214 | background-color: #fff; 215 | border-bottom: 1px solid #ccc; 216 | width: 26px; 217 | height: 26px; 218 | line-height: 26px; 219 | display: block; 220 | text-align: center; 221 | text-decoration: none; 222 | color: black; 223 | } 224 | .leaflet-bar a, 225 | .leaflet-control-layers-toggle { 226 | background-position: 50% 50%; 227 | background-repeat: no-repeat; 228 | display: block; 229 | } 230 | .leaflet-bar a:hover { 231 | background-color: #f4f4f4; 232 | } 233 | .leaflet-bar a:first-child { 234 | border-top-left-radius: 4px; 235 | border-top-right-radius: 4px; 236 | } 237 | .leaflet-bar a:last-child { 238 | border-bottom-left-radius: 4px; 239 | border-bottom-right-radius: 4px; 240 | border-bottom: none; 241 | } 242 | .leaflet-bar a.leaflet-disabled { 243 | cursor: default; 244 | background-color: #f4f4f4; 245 | color: #bbb; 246 | } 247 | 248 | .leaflet-touch .leaflet-bar a { 249 | width: 30px; 250 | height: 30px; 251 | line-height: 30px; 252 | } 253 | 254 | 255 | /* zoom control */ 256 | 257 | .leaflet-control-zoom-in, 258 | .leaflet-control-zoom-out { 259 | font: bold 18px 'Lucida Console', Monaco, monospace; 260 | text-indent: 1px; 261 | } 262 | .leaflet-control-zoom-out { 263 | font-size: 20px; 264 | } 265 | 266 | .leaflet-touch .leaflet-control-zoom-in { 267 | font-size: 22px; 268 | } 269 | .leaflet-touch .leaflet-control-zoom-out { 270 | font-size: 24px; 271 | } 272 | 273 | 274 | /* layers control */ 275 | 276 | .leaflet-control-layers { 277 | box-shadow: 0 1px 5px rgba(0,0,0,0.4); 278 | background: #fff; 279 | border-radius: 5px; 280 | } 281 | .leaflet-control-layers-toggle { 282 | background-image: url(images/layers.png); 283 | width: 36px; 284 | height: 36px; 285 | } 286 | .leaflet-retina .leaflet-control-layers-toggle { 287 | background-image: url(images/layers-2x.png); 288 | background-size: 26px 26px; 289 | } 290 | .leaflet-touch .leaflet-control-layers-toggle { 291 | width: 44px; 292 | height: 44px; 293 | } 294 | .leaflet-control-layers .leaflet-control-layers-list, 295 | .leaflet-control-layers-expanded .leaflet-control-layers-toggle { 296 | display: none; 297 | } 298 | .leaflet-control-layers-expanded .leaflet-control-layers-list { 299 | display: block; 300 | position: relative; 301 | } 302 | .leaflet-control-layers-expanded { 303 | padding: 6px 10px 6px 6px; 304 | color: #333; 305 | background: #fff; 306 | } 307 | .leaflet-control-layers-selector { 308 | margin-top: 2px; 309 | position: relative; 310 | top: 1px; 311 | } 312 | .leaflet-control-layers label { 313 | display: block; 314 | } 315 | .leaflet-control-layers-separator { 316 | height: 0; 317 | border-top: 1px solid #ddd; 318 | margin: 5px -10px 5px -6px; 319 | } 320 | 321 | 322 | /* attribution and scale controls */ 323 | 324 | .leaflet-container .leaflet-control-attribution { 325 | background: #fff; 326 | background: rgba(255, 255, 255, 0.7); 327 | margin: 0; 328 | } 329 | .leaflet-control-attribution, 330 | .leaflet-control-scale-line { 331 | padding: 0 5px; 332 | color: #333; 333 | } 334 | .leaflet-control-attribution a { 335 | text-decoration: none; 336 | } 337 | .leaflet-control-attribution a:hover { 338 | text-decoration: underline; 339 | } 340 | .leaflet-container .leaflet-control-attribution, 341 | .leaflet-container .leaflet-control-scale { 342 | font-size: 11px; 343 | } 344 | .leaflet-left .leaflet-control-scale { 345 | margin-left: 5px; 346 | } 347 | .leaflet-bottom .leaflet-control-scale { 348 | margin-bottom: 5px; 349 | } 350 | .leaflet-control-scale-line { 351 | border: 2px solid #777; 352 | border-top: none; 353 | line-height: 1.1; 354 | padding: 2px 5px 1px; 355 | font-size: 11px; 356 | white-space: nowrap; 357 | overflow: hidden; 358 | -moz-box-sizing: content-box; 359 | box-sizing: content-box; 360 | 361 | background: #fff; 362 | background: rgba(255, 255, 255, 0.5); 363 | } 364 | .leaflet-control-scale-line:not(:first-child) { 365 | border-top: 2px solid #777; 366 | border-bottom: none; 367 | margin-top: -2px; 368 | } 369 | .leaflet-control-scale-line:not(:first-child):not(:last-child) { 370 | border-bottom: 2px solid #777; 371 | } 372 | 373 | .leaflet-touch .leaflet-control-attribution, 374 | .leaflet-touch .leaflet-control-layers, 375 | .leaflet-touch .leaflet-bar { 376 | box-shadow: none; 377 | } 378 | .leaflet-touch .leaflet-control-layers, 379 | .leaflet-touch .leaflet-bar { 380 | border: 2px solid rgba(0,0,0,0.2); 381 | background-clip: padding-box; 382 | } 383 | 384 | 385 | /* popup */ 386 | 387 | .leaflet-popup { 388 | position: absolute; 389 | text-align: center; 390 | } 391 | .leaflet-popup-content-wrapper { 392 | padding: 1px; 393 | text-align: left; 394 | border-radius: 12px; 395 | } 396 | .leaflet-popup-content { 397 | margin: 13px 19px; 398 | line-height: 1.4; 399 | } 400 | .leaflet-popup-content p { 401 | margin: 18px 0; 402 | } 403 | .leaflet-popup-tip-container { 404 | margin: 0 auto; 405 | width: 40px; 406 | height: 20px; 407 | position: relative; 408 | overflow: hidden; 409 | } 410 | .leaflet-popup-tip { 411 | width: 17px; 412 | height: 17px; 413 | padding: 1px; 414 | 415 | margin: -10px auto 0; 416 | 417 | -webkit-transform: rotate(45deg); 418 | -moz-transform: rotate(45deg); 419 | -ms-transform: rotate(45deg); 420 | -o-transform: rotate(45deg); 421 | transform: rotate(45deg); 422 | } 423 | .leaflet-popup-content-wrapper, 424 | .leaflet-popup-tip { 425 | background: white; 426 | 427 | box-shadow: 0 3px 14px rgba(0,0,0,0.4); 428 | } 429 | .leaflet-container a.leaflet-popup-close-button { 430 | position: absolute; 431 | top: 0; 432 | right: 0; 433 | padding: 4px 4px 0 0; 434 | text-align: center; 435 | width: 18px; 436 | height: 14px; 437 | font: 16px/14px Tahoma, Verdana, sans-serif; 438 | color: #c3c3c3; 439 | text-decoration: none; 440 | font-weight: bold; 441 | background: transparent; 442 | } 443 | .leaflet-container a.leaflet-popup-close-button:hover { 444 | color: #999; 445 | } 446 | .leaflet-popup-scrolled { 447 | overflow: auto; 448 | border-bottom: 1px solid #ddd; 449 | border-top: 1px solid #ddd; 450 | } 451 | 452 | .leaflet-oldie .leaflet-popup-content-wrapper { 453 | zoom: 1; 454 | } 455 | .leaflet-oldie .leaflet-popup-tip { 456 | width: 24px; 457 | margin: 0 auto; 458 | 459 | -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)"; 460 | filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678); 461 | } 462 | .leaflet-oldie .leaflet-popup-tip-container { 463 | margin-top: -1px; 464 | } 465 | 466 | .leaflet-oldie .leaflet-control-zoom, 467 | .leaflet-oldie .leaflet-control-layers, 468 | .leaflet-oldie .leaflet-popup-content-wrapper, 469 | .leaflet-oldie .leaflet-popup-tip { 470 | border: 1px solid #999; 471 | } 472 | 473 | 474 | /* div icon */ 475 | 476 | .leaflet-div-icon { 477 | background: #fff; 478 | border: 1px solid #666; 479 | } 480 | -------------------------------------------------------------------------------- /css/leaflet.draw-src.css: -------------------------------------------------------------------------------- 1 | /* ================================================================== */ 2 | /* Toolbars 3 | /* ================================================================== */ 4 | 5 | .leaflet-draw-section { 6 | position: relative; 7 | } 8 | 9 | .leaflet-draw-toolbar { 10 | margin-top: 12px; 11 | } 12 | 13 | .leaflet-draw-toolbar-top { 14 | margin-top: 0; 15 | } 16 | 17 | .leaflet-draw-toolbar-notop a:first-child { 18 | border-top-right-radius: 0; 19 | } 20 | 21 | .leaflet-draw-toolbar-nobottom a:last-child { 22 | border-bottom-right-radius: 0; 23 | } 24 | 25 | .leaflet-draw-toolbar a { 26 | background-image: url('images/spritesheet.png'); 27 | background-image: linear-gradient(transparent, transparent), url('images/spritesheet.svg'); 28 | background-repeat: no-repeat; 29 | background-size: 270px 30px; 30 | background-clip: padding-box; 31 | } 32 | 33 | .leaflet-retina .leaflet-draw-toolbar a { 34 | background-image: url('images/spritesheet-2x.png'); 35 | background-image: linear-gradient(transparent, transparent), url('images/spritesheet.svg'); 36 | } 37 | 38 | .leaflet-draw a { 39 | display: block; 40 | text-align: center; 41 | text-decoration: none; 42 | } 43 | 44 | .leaflet-draw a .sr-only { 45 | position: absolute; 46 | width: 1px; 47 | height: 1px; 48 | padding: 0; 49 | margin: -1px; 50 | overflow: hidden; 51 | clip: rect(0,0,0,0); 52 | border: 0; 53 | } 54 | 55 | /* ================================================================== */ 56 | /* Toolbar actions menu 57 | /* ================================================================== */ 58 | 59 | .leaflet-draw-actions { 60 | display: none; 61 | list-style: none; 62 | margin: 0; 63 | padding: 0; 64 | position: absolute; 65 | left: 26px; /* leaflet-draw-toolbar.left + leaflet-draw-toolbar.width */ 66 | top: 0; 67 | white-space: nowrap; 68 | } 69 | 70 | .leaflet-touch .leaflet-draw-actions { 71 | left: 32px; 72 | } 73 | 74 | .leaflet-right .leaflet-draw-actions { 75 | right: 26px; 76 | left: auto; 77 | } 78 | 79 | .leaflet-touch .leaflet-right .leaflet-draw-actions { 80 | right: 32px; 81 | left: auto; 82 | } 83 | 84 | .leaflet-draw-actions li { 85 | display: inline-block; 86 | } 87 | 88 | .leaflet-draw-actions li:first-child a { 89 | border-left: none; 90 | } 91 | 92 | .leaflet-draw-actions li:last-child a { 93 | -webkit-border-radius: 0 4px 4px 0; 94 | border-radius: 0 4px 4px 0; 95 | } 96 | 97 | .leaflet-right .leaflet-draw-actions li:last-child a { 98 | -webkit-border-radius: 0; 99 | border-radius: 0; 100 | } 101 | 102 | .leaflet-right .leaflet-draw-actions li:first-child a { 103 | -webkit-border-radius: 4px 0 0 4px; 104 | border-radius: 4px 0 0 4px; 105 | } 106 | 107 | .leaflet-draw-actions a { 108 | background-color: #919187; 109 | border-left: 1px solid #AAA; 110 | color: #FFF; 111 | font: 11px/19px "Helvetica Neue", Arial, Helvetica, sans-serif; 112 | line-height: 28px; 113 | text-decoration: none; 114 | padding-left: 10px; 115 | padding-right: 10px; 116 | height: 28px; 117 | } 118 | 119 | .leaflet-touch .leaflet-draw-actions a { 120 | font-size: 12px; 121 | line-height: 30px; 122 | height: 30px; 123 | } 124 | 125 | .leaflet-draw-actions-bottom { 126 | margin-top: 0; 127 | } 128 | 129 | .leaflet-draw-actions-top { 130 | margin-top: 1px; 131 | } 132 | 133 | .leaflet-draw-actions-top a, 134 | .leaflet-draw-actions-bottom a { 135 | height: 27px; 136 | line-height: 27px; 137 | } 138 | 139 | .leaflet-draw-actions a:hover { 140 | background-color: #A0A098; 141 | } 142 | 143 | .leaflet-draw-actions-top.leaflet-draw-actions-bottom a { 144 | height: 26px; 145 | line-height: 26px; 146 | } 147 | 148 | /* ================================================================== */ 149 | /* Draw toolbar 150 | /* ================================================================== */ 151 | 152 | .leaflet-draw-toolbar .leaflet-draw-draw-polyline { 153 | background-position: -2px -2px; 154 | } 155 | 156 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-polyline { 157 | background-position: 0 -1px; 158 | } 159 | 160 | .leaflet-draw-toolbar .leaflet-draw-draw-polygon { 161 | background-position: -31px -2px; 162 | } 163 | 164 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-polygon { 165 | background-position: -29px -1px; 166 | } 167 | 168 | .leaflet-draw-toolbar .leaflet-draw-draw-rectangle { 169 | background-position: -62px -2px; 170 | } 171 | 172 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-rectangle { 173 | background-position: -60px -1px; 174 | } 175 | 176 | .leaflet-draw-toolbar .leaflet-draw-draw-circle { 177 | background-position: -92px -2px; 178 | } 179 | 180 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-circle { 181 | background-position: -90px -1px; 182 | } 183 | 184 | .leaflet-draw-toolbar .leaflet-draw-draw-marker { 185 | background-position: -122px -2px; 186 | } 187 | 188 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-draw-marker { 189 | background-position: -120px -1px; 190 | } 191 | 192 | /* ================================================================== */ 193 | /* Edit toolbar 194 | /* ================================================================== */ 195 | 196 | .leaflet-draw-toolbar .leaflet-draw-edit-edit { 197 | background-position: -152px -2px; 198 | } 199 | 200 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit { 201 | background-position: -150px -1px; 202 | } 203 | 204 | .leaflet-draw-toolbar .leaflet-draw-edit-remove { 205 | background-position: -182px -2px; 206 | } 207 | 208 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove { 209 | background-position: -180px -1px; 210 | } 211 | 212 | .leaflet-draw-toolbar .leaflet-draw-edit-edit.leaflet-disabled { 213 | background-position: -212px -2px; 214 | } 215 | 216 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-edit.leaflet-disabled { 217 | background-position: -210px -1px; 218 | } 219 | 220 | .leaflet-draw-toolbar .leaflet-draw-edit-remove.leaflet-disabled { 221 | background-position: -242px -2px; 222 | } 223 | 224 | .leaflet-touch .leaflet-draw-toolbar .leaflet-draw-edit-remove.leaflet-disabled { 225 | background-position: -240px -2px; 226 | } 227 | 228 | /* ================================================================== */ 229 | /* Drawing styles 230 | /* ================================================================== */ 231 | 232 | .leaflet-mouse-marker { 233 | background-color: #fff; 234 | cursor: crosshair; 235 | } 236 | 237 | .leaflet-draw-tooltip { 238 | background: rgb(54, 54, 54); 239 | background: rgba(0, 0, 0, 0.5); 240 | border: 1px solid transparent; 241 | -webkit-border-radius: 4px; 242 | border-radius: 4px; 243 | color: #fff; 244 | font: 12px/18px "Helvetica Neue", Arial, Helvetica, sans-serif; 245 | margin-left: 20px; 246 | margin-top: -21px; 247 | padding: 4px 8px; 248 | position: absolute; 249 | visibility: hidden; 250 | white-space: nowrap; 251 | z-index: 6; 252 | } 253 | 254 | .leaflet-draw-tooltip:before { 255 | border-right: 6px solid black; 256 | border-right-color: rgba(0, 0, 0, 0.5); 257 | border-top: 6px solid transparent; 258 | border-bottom: 6px solid transparent; 259 | content: ""; 260 | position: absolute; 261 | top: 7px; 262 | left: -7px; 263 | } 264 | 265 | .leaflet-error-draw-tooltip { 266 | background-color: #F2DEDE; 267 | border: 1px solid #E6B6BD; 268 | color: #B94A48; 269 | } 270 | 271 | .leaflet-error-draw-tooltip:before { 272 | border-right-color: #E6B6BD; 273 | } 274 | 275 | .leaflet-draw-tooltip-single { 276 | margin-top: -12px 277 | } 278 | 279 | .leaflet-draw-tooltip-subtext { 280 | color: #f8d5e4; 281 | } 282 | 283 | .leaflet-draw-guide-dash { 284 | font-size: 1%; 285 | opacity: 0.6; 286 | position: absolute; 287 | width: 5px; 288 | height: 5px; 289 | } 290 | 291 | /* ================================================================== */ 292 | /* Edit styles 293 | /* ================================================================== */ 294 | 295 | .leaflet-edit-marker-selected { 296 | background-color: rgba(254, 87, 161, 0.1); 297 | border: 4px dashed rgba(254, 87, 161, 0.6); 298 | -webkit-border-radius: 4px; 299 | border-radius: 4px; 300 | box-sizing: content-box; 301 | } 302 | 303 | .leaflet-edit-move { 304 | cursor: move; 305 | } 306 | 307 | .leaflet-edit-resize { 308 | cursor: pointer; 309 | } 310 | 311 | /* ================================================================== */ 312 | /* Old IE styles 313 | /* ================================================================== */ 314 | 315 | .leaflet-oldie .leaflet-draw-toolbar { 316 | border: 1px solid #999; 317 | } -------------------------------------------------------------------------------- /css/leaflet.label.css: -------------------------------------------------------------------------------- 1 | .leaflet-label { 2 | background: rgb(235, 235, 235); 3 | background: rgba(235, 235, 235, 0.81); 4 | background-clip: padding-box; 5 | border-color: #777; 6 | border-color: rgba(0,0,0,0.25); 7 | border-radius: 4px; 8 | border-style: solid; 9 | border-width: 4px; 10 | color: #111; 11 | display: block; 12 | font: 12px/20px "Helvetica Neue", Arial, Helvetica, sans-serif; 13 | font-weight: bold; 14 | padding: 1px 6px; 15 | position: absolute; 16 | -webkit-user-select: none; 17 | -moz-user-select: none; 18 | -ms-user-select: none; 19 | user-select: none; 20 | pointer-events: none; 21 | white-space: nowrap; 22 | z-index: 6; 23 | } 24 | 25 | .leaflet-label.leaflet-clickable { 26 | cursor: pointer; 27 | pointer-events: auto; 28 | } 29 | 30 | .leaflet-label:before, 31 | .leaflet-label:after { 32 | border-top: 6px solid transparent; 33 | border-bottom: 6px solid transparent; 34 | content: none; 35 | position: absolute; 36 | top: 5px; 37 | } 38 | 39 | .leaflet-label:before { 40 | border-right: 6px solid black; 41 | border-right-color: inherit; 42 | left: -10px; 43 | } 44 | 45 | .leaflet-label:after { 46 | border-left: 6px solid black; 47 | border-left-color: inherit; 48 | right: -10px; 49 | } 50 | 51 | .leaflet-label-right:before, 52 | .leaflet-label-left:after { 53 | content: ""; 54 | } 55 | -------------------------------------------------------------------------------- /css/sweetalert.css: -------------------------------------------------------------------------------- 1 | body.stop-scrolling { 2 | height: 100%; 3 | overflow: hidden; } 4 | 5 | .sweet-overlay { 6 | background-color: black; 7 | /* IE8 */ 8 | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; 9 | /* IE8 */ 10 | background-color: rgba(0, 0, 0, 0.4); 11 | position: fixed; 12 | left: 0; 13 | right: 0; 14 | top: 0; 15 | bottom: 0; 16 | display: none; 17 | z-index: 10000; } 18 | 19 | .sweet-alert { 20 | background-color: white; 21 | font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; 22 | width: 478px; 23 | padding: 17px; 24 | border-radius: 5px; 25 | text-align: center; 26 | position: fixed; 27 | left: 50%; 28 | top: 50%; 29 | margin-left: -256px; 30 | margin-top: -200px; 31 | overflow: hidden; 32 | display: none; 33 | z-index: 99999; } 34 | @media all and (max-width: 540px) { 35 | .sweet-alert { 36 | width: auto; 37 | margin-left: 0; 38 | margin-right: 0; 39 | left: 15px; 40 | right: 15px; } } 41 | .sweet-alert h2 { 42 | color: #575757; 43 | font-size: 30px; 44 | text-align: center; 45 | font-weight: 600; 46 | text-transform: none; 47 | position: relative; 48 | margin: 25px 0; 49 | padding: 0; 50 | line-height: 40px; 51 | display: block; } 52 | .sweet-alert p { 53 | color: #797979; 54 | font-size: 16px; 55 | text-align: center; 56 | font-weight: 300; 57 | position: relative; 58 | text-align: inherit; 59 | float: none; 60 | margin: 0; 61 | padding: 0; 62 | line-height: normal; } 63 | .sweet-alert fieldset { 64 | border: none; 65 | position: relative; } 66 | .sweet-alert .sa-error-container { 67 | background-color: #f1f1f1; 68 | margin-left: -17px; 69 | margin-right: -17px; 70 | overflow: hidden; 71 | padding: 0 10px; 72 | max-height: 0; 73 | webkit-transition: padding 0.15s, max-height 0.15s; 74 | transition: padding 0.15s, max-height 0.15s; } 75 | .sweet-alert .sa-error-container.show { 76 | padding: 10px 0; 77 | max-height: 100px; 78 | webkit-transition: padding 0.2s, max-height 0.2s; 79 | transition: padding 0.25s, max-height 0.25s; } 80 | .sweet-alert .sa-error-container .icon { 81 | display: inline-block; 82 | width: 24px; 83 | height: 24px; 84 | border-radius: 50%; 85 | background-color: #ea7d7d; 86 | color: white; 87 | line-height: 24px; 88 | text-align: center; 89 | margin-right: 3px; } 90 | .sweet-alert .sa-error-container p { 91 | display: inline-block; } 92 | .sweet-alert .sa-input-error { 93 | position: absolute; 94 | top: 29px; 95 | right: 26px; 96 | width: 20px; 97 | height: 20px; 98 | opacity: 0; 99 | -webkit-transform: scale(0.5); 100 | transform: scale(0.5); 101 | -webkit-transform-origin: 50% 50%; 102 | transform-origin: 50% 50%; 103 | -webkit-transition: all 0.1s; 104 | transition: all 0.1s; } 105 | .sweet-alert .sa-input-error::before, .sweet-alert .sa-input-error::after { 106 | content: ""; 107 | width: 20px; 108 | height: 6px; 109 | background-color: #f06e57; 110 | border-radius: 3px; 111 | position: absolute; 112 | top: 50%; 113 | margin-top: -4px; 114 | left: 50%; 115 | margin-left: -9px; } 116 | .sweet-alert .sa-input-error::before { 117 | -webkit-transform: rotate(-45deg); 118 | transform: rotate(-45deg); } 119 | .sweet-alert .sa-input-error::after { 120 | -webkit-transform: rotate(45deg); 121 | transform: rotate(45deg); } 122 | .sweet-alert .sa-input-error.show { 123 | opacity: 1; 124 | -webkit-transform: scale(1); 125 | transform: scale(1); } 126 | .sweet-alert input { 127 | width: 100%; 128 | box-sizing: border-box; 129 | border-radius: 3px; 130 | border: 1px solid #d7d7d7; 131 | height: 43px; 132 | margin-top: 10px; 133 | margin-bottom: 17px; 134 | font-size: 18px; 135 | box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.06); 136 | padding: 0 12px; 137 | display: none; 138 | -webkit-transition: all 0.3s; 139 | transition: all 0.3s; } 140 | .sweet-alert input:focus { 141 | outline: none; 142 | box-shadow: 0px 0px 3px #c4e6f5; 143 | border: 1px solid #b4dbed; } 144 | .sweet-alert input:focus::-moz-placeholder { 145 | transition: opacity 0.3s 0.03s ease; 146 | opacity: 0.5; } 147 | .sweet-alert input:focus:-ms-input-placeholder { 148 | transition: opacity 0.3s 0.03s ease; 149 | opacity: 0.5; } 150 | .sweet-alert input:focus::-webkit-input-placeholder { 151 | transition: opacity 0.3s 0.03s ease; 152 | opacity: 0.5; } 153 | .sweet-alert input::-moz-placeholder { 154 | color: #bdbdbd; } 155 | .sweet-alert input::-ms-clear { 156 | display: none; } 157 | .sweet-alert input:-ms-input-placeholder { 158 | color: #bdbdbd; } 159 | .sweet-alert input::-webkit-input-placeholder { 160 | color: #bdbdbd; } 161 | .sweet-alert.show-input input { 162 | display: block; } 163 | .sweet-alert .sa-confirm-button-container { 164 | display: inline-block; 165 | position: relative; } 166 | .sweet-alert .la-ball-fall { 167 | position: absolute; 168 | left: 50%; 169 | top: 50%; 170 | margin-left: -27px; 171 | margin-top: 4px; 172 | opacity: 0; 173 | visibility: hidden; } 174 | .sweet-alert button { 175 | background-color: #8CD4F5; 176 | color: white; 177 | border: none; 178 | box-shadow: none; 179 | font-size: 17px; 180 | font-weight: 500; 181 | -webkit-border-radius: 4px; 182 | border-radius: 5px; 183 | padding: 10px 32px; 184 | margin: 26px 5px 0 5px; 185 | cursor: pointer; } 186 | .sweet-alert button:focus { 187 | outline: none; 188 | box-shadow: 0 0 2px rgba(128, 179, 235, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.05); } 189 | .sweet-alert button:hover { 190 | background-color: #7ecff4; } 191 | .sweet-alert button:active { 192 | background-color: #5dc2f1; } 193 | .sweet-alert button.cancel { 194 | background-color: #C1C1C1; } 195 | .sweet-alert button.cancel:hover { 196 | background-color: #b9b9b9; } 197 | .sweet-alert button.cancel:active { 198 | background-color: #a8a8a8; } 199 | .sweet-alert button.cancel:focus { 200 | box-shadow: rgba(197, 205, 211, 0.8) 0px 0px 2px, rgba(0, 0, 0, 0.0470588) 0px 0px 0px 1px inset !important; } 201 | .sweet-alert button[disabled] { 202 | opacity: .6; 203 | cursor: default; } 204 | .sweet-alert button.confirm[disabled] { 205 | color: transparent; } 206 | .sweet-alert button.confirm[disabled] ~ .la-ball-fall { 207 | opacity: 1; 208 | visibility: visible; 209 | transition-delay: 0s; } 210 | .sweet-alert button::-moz-focus-inner { 211 | border: 0; } 212 | .sweet-alert[data-has-cancel-button=false] button { 213 | box-shadow: none !important; } 214 | .sweet-alert[data-has-confirm-button=false][data-has-cancel-button=false] { 215 | padding-bottom: 40px; } 216 | .sweet-alert .sa-icon { 217 | width: 80px; 218 | height: 80px; 219 | border: 4px solid gray; 220 | -webkit-border-radius: 40px; 221 | border-radius: 40px; 222 | border-radius: 50%; 223 | margin: 20px auto; 224 | padding: 0; 225 | position: relative; 226 | box-sizing: content-box; } 227 | .sweet-alert .sa-icon.sa-error { 228 | border-color: #F27474; } 229 | .sweet-alert .sa-icon.sa-error .sa-x-mark { 230 | position: relative; 231 | display: block; } 232 | .sweet-alert .sa-icon.sa-error .sa-line { 233 | position: absolute; 234 | height: 5px; 235 | width: 47px; 236 | background-color: #F27474; 237 | display: block; 238 | top: 37px; 239 | border-radius: 2px; } 240 | .sweet-alert .sa-icon.sa-error .sa-line.sa-left { 241 | -webkit-transform: rotate(45deg); 242 | transform: rotate(45deg); 243 | left: 17px; } 244 | .sweet-alert .sa-icon.sa-error .sa-line.sa-right { 245 | -webkit-transform: rotate(-45deg); 246 | transform: rotate(-45deg); 247 | right: 16px; } 248 | .sweet-alert .sa-icon.sa-warning { 249 | border-color: #F8BB86; } 250 | .sweet-alert .sa-icon.sa-warning .sa-body { 251 | position: absolute; 252 | width: 5px; 253 | height: 47px; 254 | left: 50%; 255 | top: 10px; 256 | -webkit-border-radius: 2px; 257 | border-radius: 2px; 258 | margin-left: -2px; 259 | background-color: #F8BB86; } 260 | .sweet-alert .sa-icon.sa-warning .sa-dot { 261 | position: absolute; 262 | width: 7px; 263 | height: 7px; 264 | -webkit-border-radius: 50%; 265 | border-radius: 50%; 266 | margin-left: -3px; 267 | left: 50%; 268 | bottom: 10px; 269 | background-color: #F8BB86; } 270 | .sweet-alert .sa-icon.sa-info { 271 | border-color: #C9DAE1; } 272 | .sweet-alert .sa-icon.sa-info::before { 273 | content: ""; 274 | position: absolute; 275 | width: 5px; 276 | height: 29px; 277 | left: 50%; 278 | bottom: 17px; 279 | border-radius: 2px; 280 | margin-left: -2px; 281 | background-color: #C9DAE1; } 282 | .sweet-alert .sa-icon.sa-info::after { 283 | content: ""; 284 | position: absolute; 285 | width: 7px; 286 | height: 7px; 287 | border-radius: 50%; 288 | margin-left: -3px; 289 | top: 19px; 290 | background-color: #C9DAE1; 291 | left: 50%; } 292 | .sweet-alert .sa-icon.sa-success { 293 | border-color: #A5DC86; } 294 | .sweet-alert .sa-icon.sa-success::before, .sweet-alert .sa-icon.sa-success::after { 295 | content: ''; 296 | -webkit-border-radius: 40px; 297 | border-radius: 40px; 298 | border-radius: 50%; 299 | position: absolute; 300 | width: 60px; 301 | height: 120px; 302 | background: white; 303 | -webkit-transform: rotate(45deg); 304 | transform: rotate(45deg); } 305 | .sweet-alert .sa-icon.sa-success::before { 306 | -webkit-border-radius: 120px 0 0 120px; 307 | border-radius: 120px 0 0 120px; 308 | top: -7px; 309 | left: -33px; 310 | -webkit-transform: rotate(-45deg); 311 | transform: rotate(-45deg); 312 | -webkit-transform-origin: 60px 60px; 313 | transform-origin: 60px 60px; } 314 | .sweet-alert .sa-icon.sa-success::after { 315 | -webkit-border-radius: 0 120px 120px 0; 316 | border-radius: 0 120px 120px 0; 317 | top: -11px; 318 | left: 30px; 319 | -webkit-transform: rotate(-45deg); 320 | transform: rotate(-45deg); 321 | -webkit-transform-origin: 0px 60px; 322 | transform-origin: 0px 60px; } 323 | .sweet-alert .sa-icon.sa-success .sa-placeholder { 324 | width: 80px; 325 | height: 80px; 326 | border: 4px solid rgba(165, 220, 134, 0.2); 327 | -webkit-border-radius: 40px; 328 | border-radius: 40px; 329 | border-radius: 50%; 330 | box-sizing: content-box; 331 | position: absolute; 332 | left: -4px; 333 | top: -4px; 334 | z-index: 2; } 335 | .sweet-alert .sa-icon.sa-success .sa-fix { 336 | width: 5px; 337 | height: 90px; 338 | background-color: white; 339 | position: absolute; 340 | left: 28px; 341 | top: 8px; 342 | z-index: 1; 343 | -webkit-transform: rotate(-45deg); 344 | transform: rotate(-45deg); } 345 | .sweet-alert .sa-icon.sa-success .sa-line { 346 | height: 5px; 347 | background-color: #A5DC86; 348 | display: block; 349 | border-radius: 2px; 350 | position: absolute; 351 | z-index: 2; } 352 | .sweet-alert .sa-icon.sa-success .sa-line.sa-tip { 353 | width: 25px; 354 | left: 14px; 355 | top: 46px; 356 | -webkit-transform: rotate(45deg); 357 | transform: rotate(45deg); } 358 | .sweet-alert .sa-icon.sa-success .sa-line.sa-long { 359 | width: 47px; 360 | right: 8px; 361 | top: 38px; 362 | -webkit-transform: rotate(-45deg); 363 | transform: rotate(-45deg); } 364 | .sweet-alert .sa-icon.sa-custom { 365 | background-size: contain; 366 | border-radius: 0; 367 | border: none; 368 | background-position: center center; 369 | background-repeat: no-repeat; } 370 | 371 | /* 372 | * Animations 373 | */ 374 | @-webkit-keyframes showSweetAlert { 375 | 0% { 376 | transform: scale(0.7); 377 | -webkit-transform: scale(0.7); } 378 | 45% { 379 | transform: scale(1.05); 380 | -webkit-transform: scale(1.05); } 381 | 80% { 382 | transform: scale(0.95); 383 | -webkit-transform: scale(0.95); } 384 | 100% { 385 | transform: scale(1); 386 | -webkit-transform: scale(1); } } 387 | 388 | @keyframes showSweetAlert { 389 | 0% { 390 | transform: scale(0.7); 391 | -webkit-transform: scale(0.7); } 392 | 45% { 393 | transform: scale(1.05); 394 | -webkit-transform: scale(1.05); } 395 | 80% { 396 | transform: scale(0.95); 397 | -webkit-transform: scale(0.95); } 398 | 100% { 399 | transform: scale(1); 400 | -webkit-transform: scale(1); } } 401 | 402 | @-webkit-keyframes hideSweetAlert { 403 | 0% { 404 | transform: scale(1); 405 | -webkit-transform: scale(1); } 406 | 100% { 407 | transform: scale(0.5); 408 | -webkit-transform: scale(0.5); } } 409 | 410 | @keyframes hideSweetAlert { 411 | 0% { 412 | transform: scale(1); 413 | -webkit-transform: scale(1); } 414 | 100% { 415 | transform: scale(0.5); 416 | -webkit-transform: scale(0.5); } } 417 | 418 | @-webkit-keyframes slideFromTop { 419 | 0% { 420 | top: 0%; } 421 | 100% { 422 | top: 50%; } } 423 | 424 | @keyframes slideFromTop { 425 | 0% { 426 | top: 0%; } 427 | 100% { 428 | top: 50%; } } 429 | 430 | @-webkit-keyframes slideToTop { 431 | 0% { 432 | top: 50%; } 433 | 100% { 434 | top: 0%; } } 435 | 436 | @keyframes slideToTop { 437 | 0% { 438 | top: 50%; } 439 | 100% { 440 | top: 0%; } } 441 | 442 | @-webkit-keyframes slideFromBottom { 443 | 0% { 444 | top: 70%; } 445 | 100% { 446 | top: 50%; } } 447 | 448 | @keyframes slideFromBottom { 449 | 0% { 450 | top: 70%; } 451 | 100% { 452 | top: 50%; } } 453 | 454 | @-webkit-keyframes slideToBottom { 455 | 0% { 456 | top: 50%; } 457 | 100% { 458 | top: 70%; } } 459 | 460 | @keyframes slideToBottom { 461 | 0% { 462 | top: 50%; } 463 | 100% { 464 | top: 70%; } } 465 | 466 | .showSweetAlert[data-animation=pop] { 467 | -webkit-animation: showSweetAlert 0.3s; 468 | animation: showSweetAlert 0.3s; } 469 | 470 | .showSweetAlert[data-animation=none] { 471 | -webkit-animation: none; 472 | animation: none; } 473 | 474 | .showSweetAlert[data-animation=slide-from-top] { 475 | -webkit-animation: slideFromTop 0.3s; 476 | animation: slideFromTop 0.3s; } 477 | 478 | .showSweetAlert[data-animation=slide-from-bottom] { 479 | -webkit-animation: slideFromBottom 0.3s; 480 | animation: slideFromBottom 0.3s; } 481 | 482 | .hideSweetAlert[data-animation=pop] { 483 | -webkit-animation: hideSweetAlert 0.2s; 484 | animation: hideSweetAlert 0.2s; } 485 | 486 | .hideSweetAlert[data-animation=none] { 487 | -webkit-animation: none; 488 | animation: none; } 489 | 490 | .hideSweetAlert[data-animation=slide-from-top] { 491 | -webkit-animation: slideToTop 0.4s; 492 | animation: slideToTop 0.4s; } 493 | 494 | .hideSweetAlert[data-animation=slide-from-bottom] { 495 | -webkit-animation: slideToBottom 0.3s; 496 | animation: slideToBottom 0.3s; } 497 | 498 | @-webkit-keyframes animateSuccessTip { 499 | 0% { 500 | width: 0; 501 | left: 1px; 502 | top: 19px; } 503 | 54% { 504 | width: 0; 505 | left: 1px; 506 | top: 19px; } 507 | 70% { 508 | width: 50px; 509 | left: -8px; 510 | top: 37px; } 511 | 84% { 512 | width: 17px; 513 | left: 21px; 514 | top: 48px; } 515 | 100% { 516 | width: 25px; 517 | left: 14px; 518 | top: 45px; } } 519 | 520 | @keyframes animateSuccessTip { 521 | 0% { 522 | width: 0; 523 | left: 1px; 524 | top: 19px; } 525 | 54% { 526 | width: 0; 527 | left: 1px; 528 | top: 19px; } 529 | 70% { 530 | width: 50px; 531 | left: -8px; 532 | top: 37px; } 533 | 84% { 534 | width: 17px; 535 | left: 21px; 536 | top: 48px; } 537 | 100% { 538 | width: 25px; 539 | left: 14px; 540 | top: 45px; } } 541 | 542 | @-webkit-keyframes animateSuccessLong { 543 | 0% { 544 | width: 0; 545 | right: 46px; 546 | top: 54px; } 547 | 65% { 548 | width: 0; 549 | right: 46px; 550 | top: 54px; } 551 | 84% { 552 | width: 55px; 553 | right: 0px; 554 | top: 35px; } 555 | 100% { 556 | width: 47px; 557 | right: 8px; 558 | top: 38px; } } 559 | 560 | @keyframes animateSuccessLong { 561 | 0% { 562 | width: 0; 563 | right: 46px; 564 | top: 54px; } 565 | 65% { 566 | width: 0; 567 | right: 46px; 568 | top: 54px; } 569 | 84% { 570 | width: 55px; 571 | right: 0px; 572 | top: 35px; } 573 | 100% { 574 | width: 47px; 575 | right: 8px; 576 | top: 38px; } } 577 | 578 | @-webkit-keyframes rotatePlaceholder { 579 | 0% { 580 | transform: rotate(-45deg); 581 | -webkit-transform: rotate(-45deg); } 582 | 5% { 583 | transform: rotate(-45deg); 584 | -webkit-transform: rotate(-45deg); } 585 | 12% { 586 | transform: rotate(-405deg); 587 | -webkit-transform: rotate(-405deg); } 588 | 100% { 589 | transform: rotate(-405deg); 590 | -webkit-transform: rotate(-405deg); } } 591 | 592 | @keyframes rotatePlaceholder { 593 | 0% { 594 | transform: rotate(-45deg); 595 | -webkit-transform: rotate(-45deg); } 596 | 5% { 597 | transform: rotate(-45deg); 598 | -webkit-transform: rotate(-45deg); } 599 | 12% { 600 | transform: rotate(-405deg); 601 | -webkit-transform: rotate(-405deg); } 602 | 100% { 603 | transform: rotate(-405deg); 604 | -webkit-transform: rotate(-405deg); } } 605 | 606 | .animateSuccessTip { 607 | -webkit-animation: animateSuccessTip 0.75s; 608 | animation: animateSuccessTip 0.75s; } 609 | 610 | .animateSuccessLong { 611 | -webkit-animation: animateSuccessLong 0.75s; 612 | animation: animateSuccessLong 0.75s; } 613 | 614 | .sa-icon.sa-success.animate::after { 615 | -webkit-animation: rotatePlaceholder 4.25s ease-in; 616 | animation: rotatePlaceholder 4.25s ease-in; } 617 | 618 | @-webkit-keyframes animateErrorIcon { 619 | 0% { 620 | transform: rotateX(100deg); 621 | -webkit-transform: rotateX(100deg); 622 | opacity: 0; } 623 | 100% { 624 | transform: rotateX(0deg); 625 | -webkit-transform: rotateX(0deg); 626 | opacity: 1; } } 627 | 628 | @keyframes animateErrorIcon { 629 | 0% { 630 | transform: rotateX(100deg); 631 | -webkit-transform: rotateX(100deg); 632 | opacity: 0; } 633 | 100% { 634 | transform: rotateX(0deg); 635 | -webkit-transform: rotateX(0deg); 636 | opacity: 1; } } 637 | 638 | .animateErrorIcon { 639 | -webkit-animation: animateErrorIcon 0.5s; 640 | animation: animateErrorIcon 0.5s; } 641 | 642 | @-webkit-keyframes animateXMark { 643 | 0% { 644 | transform: scale(0.4); 645 | -webkit-transform: scale(0.4); 646 | margin-top: 26px; 647 | opacity: 0; } 648 | 50% { 649 | transform: scale(0.4); 650 | -webkit-transform: scale(0.4); 651 | margin-top: 26px; 652 | opacity: 0; } 653 | 80% { 654 | transform: scale(1.15); 655 | -webkit-transform: scale(1.15); 656 | margin-top: -6px; } 657 | 100% { 658 | transform: scale(1); 659 | -webkit-transform: scale(1); 660 | margin-top: 0; 661 | opacity: 1; } } 662 | 663 | @keyframes animateXMark { 664 | 0% { 665 | transform: scale(0.4); 666 | -webkit-transform: scale(0.4); 667 | margin-top: 26px; 668 | opacity: 0; } 669 | 50% { 670 | transform: scale(0.4); 671 | -webkit-transform: scale(0.4); 672 | margin-top: 26px; 673 | opacity: 0; } 674 | 80% { 675 | transform: scale(1.15); 676 | -webkit-transform: scale(1.15); 677 | margin-top: -6px; } 678 | 100% { 679 | transform: scale(1); 680 | -webkit-transform: scale(1); 681 | margin-top: 0; 682 | opacity: 1; } } 683 | 684 | .animateXMark { 685 | -webkit-animation: animateXMark 0.5s; 686 | animation: animateXMark 0.5s; } 687 | 688 | @-webkit-keyframes pulseWarning { 689 | 0% { 690 | border-color: #F8D486; } 691 | 100% { 692 | border-color: #F8BB86; } } 693 | 694 | @keyframes pulseWarning { 695 | 0% { 696 | border-color: #F8D486; } 697 | 100% { 698 | border-color: #F8BB86; } } 699 | 700 | .pulseWarning { 701 | -webkit-animation: pulseWarning 0.75s infinite alternate; 702 | animation: pulseWarning 0.75s infinite alternate; } 703 | 704 | @-webkit-keyframes pulseWarningIns { 705 | 0% { 706 | background-color: #F8D486; } 707 | 100% { 708 | background-color: #F8BB86; } } 709 | 710 | @keyframes pulseWarningIns { 711 | 0% { 712 | background-color: #F8D486; } 713 | 100% { 714 | background-color: #F8BB86; } } 715 | 716 | .pulseWarningIns { 717 | -webkit-animation: pulseWarningIns 0.75s infinite alternate; 718 | animation: pulseWarningIns 0.75s infinite alternate; } 719 | 720 | @-webkit-keyframes rotate-loading { 721 | 0% { 722 | transform: rotate(0deg); } 723 | 100% { 724 | transform: rotate(360deg); } } 725 | 726 | @keyframes rotate-loading { 727 | 0% { 728 | transform: rotate(0deg); } 729 | 100% { 730 | transform: rotate(360deg); } } 731 | 732 | /* Internet Explorer 9 has some special quirks that are fixed here */ 733 | /* The icons are not animated. */ 734 | /* This file is automatically merged into sweet-alert.min.js through Gulp */ 735 | /* Error icon */ 736 | .sweet-alert .sa-icon.sa-error .sa-line.sa-left { 737 | -ms-transform: rotate(45deg) \9; } 738 | 739 | .sweet-alert .sa-icon.sa-error .sa-line.sa-right { 740 | -ms-transform: rotate(-45deg) \9; } 741 | 742 | /* Success icon */ 743 | .sweet-alert .sa-icon.sa-success { 744 | border-color: transparent\9; } 745 | 746 | .sweet-alert .sa-icon.sa-success .sa-line.sa-tip { 747 | -ms-transform: rotate(45deg) \9; } 748 | 749 | .sweet-alert .sa-icon.sa-success .sa-line.sa-long { 750 | -ms-transform: rotate(-45deg) \9; } 751 | 752 | /*! 753 | * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/) 754 | * Copyright 2015 Daniel Cardoso <@DanielCardoso> 755 | * Licensed under MIT 756 | */ 757 | .la-ball-fall, 758 | .la-ball-fall > div { 759 | position: relative; 760 | -webkit-box-sizing: border-box; 761 | -moz-box-sizing: border-box; 762 | box-sizing: border-box; } 763 | 764 | .la-ball-fall { 765 | display: block; 766 | font-size: 0; 767 | color: #fff; } 768 | 769 | .la-ball-fall.la-dark { 770 | color: #333; } 771 | 772 | .la-ball-fall > div { 773 | display: inline-block; 774 | float: none; 775 | background-color: currentColor; 776 | border: 0 solid currentColor; } 777 | 778 | .la-ball-fall { 779 | width: 54px; 780 | height: 18px; } 781 | 782 | .la-ball-fall > div { 783 | width: 10px; 784 | height: 10px; 785 | margin: 4px; 786 | border-radius: 100%; 787 | opacity: 0; 788 | -webkit-animation: ball-fall 1s ease-in-out infinite; 789 | -moz-animation: ball-fall 1s ease-in-out infinite; 790 | -o-animation: ball-fall 1s ease-in-out infinite; 791 | animation: ball-fall 1s ease-in-out infinite; } 792 | 793 | .la-ball-fall > div:nth-child(1) { 794 | -webkit-animation-delay: -200ms; 795 | -moz-animation-delay: -200ms; 796 | -o-animation-delay: -200ms; 797 | animation-delay: -200ms; } 798 | 799 | .la-ball-fall > div:nth-child(2) { 800 | -webkit-animation-delay: -100ms; 801 | -moz-animation-delay: -100ms; 802 | -o-animation-delay: -100ms; 803 | animation-delay: -100ms; } 804 | 805 | .la-ball-fall > div:nth-child(3) { 806 | -webkit-animation-delay: 0ms; 807 | -moz-animation-delay: 0ms; 808 | -o-animation-delay: 0ms; 809 | animation-delay: 0ms; } 810 | 811 | .la-ball-fall.la-sm { 812 | width: 26px; 813 | height: 8px; } 814 | 815 | .la-ball-fall.la-sm > div { 816 | width: 4px; 817 | height: 4px; 818 | margin: 2px; } 819 | 820 | .la-ball-fall.la-2x { 821 | width: 108px; 822 | height: 36px; } 823 | 824 | .la-ball-fall.la-2x > div { 825 | width: 20px; 826 | height: 20px; 827 | margin: 8px; } 828 | 829 | .la-ball-fall.la-3x { 830 | width: 162px; 831 | height: 54px; } 832 | 833 | .la-ball-fall.la-3x > div { 834 | width: 30px; 835 | height: 30px; 836 | margin: 12px; } 837 | 838 | /* 839 | * Animation 840 | */ 841 | @-webkit-keyframes ball-fall { 842 | 0% { 843 | opacity: 0; 844 | -webkit-transform: translateY(-145%); 845 | transform: translateY(-145%); } 846 | 10% { 847 | opacity: .5; } 848 | 20% { 849 | opacity: 1; 850 | -webkit-transform: translateY(0); 851 | transform: translateY(0); } 852 | 80% { 853 | opacity: 1; 854 | -webkit-transform: translateY(0); 855 | transform: translateY(0); } 856 | 90% { 857 | opacity: .5; } 858 | 100% { 859 | opacity: 0; 860 | -webkit-transform: translateY(145%); 861 | transform: translateY(145%); } } 862 | 863 | @-moz-keyframes ball-fall { 864 | 0% { 865 | opacity: 0; 866 | -moz-transform: translateY(-145%); 867 | transform: translateY(-145%); } 868 | 10% { 869 | opacity: .5; } 870 | 20% { 871 | opacity: 1; 872 | -moz-transform: translateY(0); 873 | transform: translateY(0); } 874 | 80% { 875 | opacity: 1; 876 | -moz-transform: translateY(0); 877 | transform: translateY(0); } 878 | 90% { 879 | opacity: .5; } 880 | 100% { 881 | opacity: 0; 882 | -moz-transform: translateY(145%); 883 | transform: translateY(145%); } } 884 | 885 | @-o-keyframes ball-fall { 886 | 0% { 887 | opacity: 0; 888 | -o-transform: translateY(-145%); 889 | transform: translateY(-145%); } 890 | 10% { 891 | opacity: .5; } 892 | 20% { 893 | opacity: 1; 894 | -o-transform: translateY(0); 895 | transform: translateY(0); } 896 | 80% { 897 | opacity: 1; 898 | -o-transform: translateY(0); 899 | transform: translateY(0); } 900 | 90% { 901 | opacity: .5; } 902 | 100% { 903 | opacity: 0; 904 | -o-transform: translateY(145%); 905 | transform: translateY(145%); } } 906 | 907 | @keyframes ball-fall { 908 | 0% { 909 | opacity: 0; 910 | -webkit-transform: translateY(-145%); 911 | -moz-transform: translateY(-145%); 912 | -o-transform: translateY(-145%); 913 | transform: translateY(-145%); } 914 | 10% { 915 | opacity: .5; } 916 | 20% { 917 | opacity: 1; 918 | -webkit-transform: translateY(0); 919 | -moz-transform: translateY(0); 920 | -o-transform: translateY(0); 921 | transform: translateY(0); } 922 | 80% { 923 | opacity: 1; 924 | -webkit-transform: translateY(0); 925 | -moz-transform: translateY(0); 926 | -o-transform: translateY(0); 927 | transform: translateY(0); } 928 | 90% { 929 | opacity: .5; } 930 | 100% { 931 | opacity: 0; 932 | -webkit-transform: translateY(145%); 933 | -moz-transform: translateY(145%); 934 | -o-transform: translateY(145%); 935 | transform: translateY(145%); } } 936 | -------------------------------------------------------------------------------- /css/sweetalert2.min.css: -------------------------------------------------------------------------------- 1 | body.swal2-shown{overflow-y:hidden}body.swal2-iosfix{position:fixed;left:0;right:0}.swal2-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:fixed;top:0;left:0;bottom:0;right:0;padding:10px;background-color:transparent;z-index:1060}.swal2-container.swal2-fade{-webkit-transition:background-color .1s;transition:background-color .1s}.swal2-container.swal2-shown{background-color:rgba(0,0,0,.4)}.swal2-modal{background-color:#fff;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;border-radius:5px;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;margin:auto;overflow-x:hidden;overflow-y:auto;display:none;position:relative;max-width:100%}.swal2-modal:focus{outline:0}.swal2-modal.swal2-loading{overflow-y:hidden}.swal2-modal .swal2-title{color:#595959;font-size:30px;text-align:center;font-weight:600;text-transform:none;position:relative;margin:0 0 .4em;padding:0;display:block;word-wrap:break-word}.swal2-modal .swal2-buttonswrapper{margin-top:15px}.swal2-modal .swal2-buttonswrapper:not(.swal2-loading) .swal2-styled[disabled]{opacity:.4;cursor:no-drop}.swal2-modal .swal2-buttonswrapper.swal2-loading .swal2-styled.swal2-confirm{-webkit-box-sizing:border-box;box-sizing:border-box;border:4px solid transparent;border-color:transparent;width:40px;height:40px;padding:0;margin:7.5px;vertical-align:top;background-color:transparent!important;color:transparent;cursor:default;border-radius:100%;-webkit-animation:rotate-loading 1.5s linear 0s infinite normal;animation:rotate-loading 1.5s linear 0s infinite normal;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.swal2-modal .swal2-buttonswrapper.swal2-loading .swal2-styled.swal2-cancel{margin-left:30px;margin-right:30px}.swal2-modal .swal2-buttonswrapper.swal2-loading :not(.swal2-styled).swal2-confirm::after{display:inline-block;content:'';margin-left:5px 0 15px;vertical-align:-1px;height:15px;width:15px;border:3px solid #999;-webkit-box-shadow:1px 1px 1px #fff;box-shadow:1px 1px 1px #fff;border-right-color:transparent;border-radius:50%;-webkit-animation:rotate-loading 1.5s linear 0s infinite normal;animation:rotate-loading 1.5s linear 0s infinite normal}.swal2-modal .swal2-styled{border:0;border-radius:3px;-webkit-box-shadow:none;box-shadow:none;color:#fff;cursor:pointer;font-size:17px;font-weight:500;margin:15px 5px 0;padding:10px 32px}.swal2-modal .swal2-image{margin:20px auto;max-width:100%}.swal2-modal .swal2-close{background:0 0;border:0;margin:0;padding:0;width:38px;height:40px;font-size:36px;line-height:40px;font-family:serif;position:absolute;top:5px;right:8px;cursor:pointer;color:#ccc;-webkit-transition:color .1s ease;transition:color .1s ease}.swal2-modal .swal2-close:hover{color:#d55}.swal2-modal>.swal2-checkbox,.swal2-modal>.swal2-file,.swal2-modal>.swal2-input,.swal2-modal>.swal2-radio,.swal2-modal>.swal2-select,.swal2-modal>.swal2-textarea{display:none}.swal2-modal .swal2-content{font-size:18px;text-align:center;font-weight:300;position:relative;float:none;margin:0;padding:0;line-height:normal;color:#545454;word-wrap:break-word}.swal2-modal .swal2-checkbox,.swal2-modal .swal2-file,.swal2-modal .swal2-input,.swal2-modal .swal2-radio,.swal2-modal .swal2-select,.swal2-modal .swal2-textarea{margin:20px auto}.swal2-modal .swal2-file,.swal2-modal .swal2-input,.swal2-modal .swal2-textarea{width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:18px;border-radius:3px;border:1px solid #d9d9d9;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.06);box-shadow:inset 0 1px 1px rgba(0,0,0,.06);-webkit-transition:border-color box-shadow .3s;transition:border-color box-shadow .3s}.swal2-modal .swal2-file.swal2-inputerror,.swal2-modal .swal2-input.swal2-inputerror,.swal2-modal .swal2-textarea.swal2-inputerror{border-color:#f27474!important;-webkit-box-shadow:0 0 2px #f27474!important;box-shadow:0 0 2px #f27474!important}.swal2-modal .swal2-file:focus,.swal2-modal .swal2-input:focus,.swal2-modal .swal2-textarea:focus{outline:0;border:1px solid #b4dbed;-webkit-box-shadow:0 0 3px #c4e6f5;box-shadow:0 0 3px #c4e6f5}.swal2-modal .swal2-file:focus::-webkit-input-placeholder,.swal2-modal .swal2-input:focus::-webkit-input-placeholder,.swal2-modal .swal2-textarea:focus::-webkit-input-placeholder{-webkit-transition:opacity .3s .03s ease;transition:opacity .3s .03s ease;opacity:.8}.swal2-modal .swal2-file:focus:-ms-input-placeholder,.swal2-modal .swal2-input:focus:-ms-input-placeholder,.swal2-modal .swal2-textarea:focus:-ms-input-placeholder{-webkit-transition:opacity .3s .03s ease;transition:opacity .3s .03s ease;opacity:.8}.swal2-modal .swal2-file:focus::placeholder,.swal2-modal .swal2-input:focus::placeholder,.swal2-modal .swal2-textarea:focus::placeholder{-webkit-transition:opacity .3s .03s ease;transition:opacity .3s .03s ease;opacity:.8}.swal2-modal .swal2-file::-webkit-input-placeholder,.swal2-modal .swal2-input::-webkit-input-placeholder,.swal2-modal .swal2-textarea::-webkit-input-placeholder{color:#e6e6e6}.swal2-modal .swal2-file:-ms-input-placeholder,.swal2-modal .swal2-input:-ms-input-placeholder,.swal2-modal .swal2-textarea:-ms-input-placeholder{color:#e6e6e6}.swal2-modal .swal2-file::placeholder,.swal2-modal .swal2-input::placeholder,.swal2-modal .swal2-textarea::placeholder{color:#e6e6e6}.swal2-modal .swal2-range input{float:left;width:80%}.swal2-modal .swal2-range output{float:right;width:20%;font-size:20px;font-weight:600;text-align:center}.swal2-modal .swal2-range input,.swal2-modal .swal2-range output{height:43px;line-height:43px;vertical-align:middle;margin:20px auto;padding:0}.swal2-modal .swal2-input{height:43px;padding:0 12px}.swal2-modal .swal2-input[type=number]{max-width:150px}.swal2-modal .swal2-file{font-size:20px}.swal2-modal .swal2-textarea{height:108px;padding:12px}.swal2-modal .swal2-select{color:#545454;font-size:inherit;padding:5px 10px;min-width:40%;max-width:100%}.swal2-modal .swal2-radio{border:0}.swal2-modal .swal2-radio label:not(:first-child){margin-left:20px}.swal2-modal .swal2-radio input,.swal2-modal .swal2-radio span{vertical-align:middle}.swal2-modal .swal2-radio input{margin:0 3px 0 0}.swal2-modal .swal2-checkbox{color:#545454}.swal2-modal .swal2-checkbox input,.swal2-modal .swal2-checkbox span{vertical-align:middle}.swal2-modal .swal2-validationerror{background-color:#f0f0f0;margin:0 -20px;overflow:hidden;padding:10px;color:gray;font-size:16px;font-weight:300;display:none}.swal2-modal .swal2-validationerror::before{content:'!';display:inline-block;width:24px;height:24px;border-radius:50%;background-color:#ea7d7d;color:#fff;line-height:24px;text-align:center;margin-right:10px}@supports (-ms-accelerator:true){.swal2-range input{width:100%!important}.swal2-range output{display:none}}@media all and (-ms-high-contrast:none),(-ms-high-contrast:active){.swal2-range input{width:100%!important}.swal2-range output{display:none}}.swal2-icon{width:80px;height:80px;border:4px solid transparent;border-radius:50%;margin:20px auto 30px;padding:0;position:relative;-webkit-box-sizing:content-box;box-sizing:content-box;cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.swal2-icon.swal2-error{border-color:#f27474}.swal2-icon.swal2-error .swal2-x-mark{position:relative;display:block}.swal2-icon.swal2-error [class^=swal2-x-mark-line]{position:absolute;height:5px;width:47px;background-color:#f27474;display:block;top:37px;border-radius:2px}.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left]{-webkit-transform:rotate(45deg);transform:rotate(45deg);left:17px}.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right]{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);right:16px}.swal2-icon.swal2-warning{font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;color:#f8bb86;border-color:#facea8;font-size:60px;line-height:80px;text-align:center}.swal2-icon.swal2-info{font-family:'Open Sans',sans-serif;color:#3fc3ee;border-color:#9de0f6;font-size:60px;line-height:80px;text-align:center}.swal2-icon.swal2-question{font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;color:#87adbd;border-color:#c9dae1;font-size:60px;line-height:80px;text-align:center}.swal2-icon.swal2-success{border-color:#a5dc86}.swal2-icon.swal2-success [class^=swal2-success-circular-line]{border-radius:50%;position:absolute;width:60px;height:120px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=left]{border-radius:120px 0 0 120px;top:-7px;left:-33px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:60px 60px;transform-origin:60px 60px}.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=right]{border-radius:0 120px 120px 0;top:-11px;left:30px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:0 60px;transform-origin:0 60px}.swal2-icon.swal2-success .swal2-success-ring{width:80px;height:80px;border:4px solid rgba(165,220,134,.2);border-radius:50%;-webkit-box-sizing:content-box;box-sizing:content-box;position:absolute;left:-4px;top:-4px;z-index:2}.swal2-icon.swal2-success .swal2-success-fix{width:7px;height:90px;position:absolute;left:28px;top:8px;z-index:1;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.swal2-icon.swal2-success [class^=swal2-success-line]{height:5px;background-color:#a5dc86;display:block;border-radius:2px;position:absolute;z-index:2}.swal2-icon.swal2-success [class^=swal2-success-line][class$=tip]{width:25px;left:14px;top:46px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.swal2-icon.swal2-success [class^=swal2-success-line][class$=long]{width:47px;right:8px;top:38px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.swal2-progresssteps{font-weight:600;margin:0 0 20px;padding:0}.swal2-progresssteps li{display:inline-block;position:relative}.swal2-progresssteps .swal2-progresscircle{background:#3085d6;border-radius:2em;color:#fff;height:2em;line-height:2em;text-align:center;width:2em;z-index:20}.swal2-progresssteps .swal2-progresscircle:first-child{margin-left:0}.swal2-progresssteps .swal2-progresscircle:last-child{margin-right:0}.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep{background:#3085d6}.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep~.swal2-progresscircle{background:#add8e6}.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep~.swal2-progressline{background:#add8e6}.swal2-progresssteps .swal2-progressline{background:#3085d6;height:.4em;margin:0 -1px;z-index:10}[class^=swal2]{-webkit-tap-highlight-color:transparent}@-webkit-keyframes showSweetAlert{0%{-webkit-transform:scale(.7);transform:scale(.7)}45%{-webkit-transform:scale(1.05);transform:scale(1.05)}80%{-webkit-transform:scale(.95);transform:scale(.95)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes showSweetAlert{0%{-webkit-transform:scale(.7);transform:scale(.7)}45%{-webkit-transform:scale(1.05);transform:scale(1.05)}80%{-webkit-transform:scale(.95);transform:scale(.95)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes hideSweetAlert{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}100%{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}}@keyframes hideSweetAlert{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}100%{-webkit-transform:scale(.5);transform:scale(.5);opacity:0}}.swal2-show{-webkit-animation:showSweetAlert .3s;animation:showSweetAlert .3s}.swal2-show.swal2-noanimation{-webkit-animation:none;animation:none}.swal2-hide{-webkit-animation:hideSweetAlert .15s forwards;animation:hideSweetAlert .15s forwards}.swal2-hide.swal2-noanimation{-webkit-animation:none;animation:none}@-webkit-keyframes animate-success-tip{0%{width:0;left:1px;top:19px}54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@keyframes animate-success-tip{0%{width:0;left:1px;top:19px}54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@-webkit-keyframes animate-success-long{0%{width:0;right:46px;top:54px}65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@keyframes animate-success-long{0%{width:0;right:46px;top:54px}65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@-webkit-keyframes rotatePlaceholder{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}5%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}12%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}100%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}}@keyframes rotatePlaceholder{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}5%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}12%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}100%{-webkit-transform:rotate(-405deg);transform:rotate(-405deg)}}.swal2-animate-success-line-tip{-webkit-animation:animate-success-tip .75s;animation:animate-success-tip .75s}.swal2-animate-success-line-long{-webkit-animation:animate-success-long .75s;animation:animate-success-long .75s}.swal2-success.swal2-animate-success-icon .swal2-success-circular-line-right{-webkit-animation:rotatePlaceholder 4.25s ease-in;animation:rotatePlaceholder 4.25s ease-in}@-webkit-keyframes animate-error-icon{0%{-webkit-transform:rotateX(100deg);transform:rotateX(100deg);opacity:0}100%{-webkit-transform:rotateX(0);transform:rotateX(0);opacity:1}}@keyframes animate-error-icon{0%{-webkit-transform:rotateX(100deg);transform:rotateX(100deg);opacity:0}100%{-webkit-transform:rotateX(0);transform:rotateX(0);opacity:1}}.swal2-animate-error-icon{-webkit-animation:animate-error-icon .5s;animation:animate-error-icon .5s}@-webkit-keyframes animate-x-mark{0%{-webkit-transform:scale(.4);transform:scale(.4);margin-top:26px;opacity:0}50%{-webkit-transform:scale(.4);transform:scale(.4);margin-top:26px;opacity:0}80%{-webkit-transform:scale(1.15);transform:scale(1.15);margin-top:-6px}100%{-webkit-transform:scale(1);transform:scale(1);margin-top:0;opacity:1}}@keyframes animate-x-mark{0%{-webkit-transform:scale(.4);transform:scale(.4);margin-top:26px;opacity:0}50%{-webkit-transform:scale(.4);transform:scale(.4);margin-top:26px;opacity:0}80%{-webkit-transform:scale(1.15);transform:scale(1.15);margin-top:-6px}100%{-webkit-transform:scale(1);transform:scale(1);margin-top:0;opacity:1}}.swal2-animate-x-mark{-webkit-animation:animate-x-mark .5s;animation:animate-x-mark .5s}@-webkit-keyframes rotate-loading{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate-loading{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}} -------------------------------------------------------------------------------- /img/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/img/1.jpg -------------------------------------------------------------------------------- /img/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/img/2.jpg -------------------------------------------------------------------------------- /img/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/img/3.jpg -------------------------------------------------------------------------------- /img/4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/img/4.png -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 户型图 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 69 | 70 | 71 |
72 | 73 | 74 | 75 | 76 |
77 |

直接将图片拖拽到页面内也可更换户型图(注意点击"保存户型图",数据暂时保存在浏览器)

78 |
79 |

当前可选区域(点击删除),点我添加更多

80 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 848 | 849 | -------------------------------------------------------------------------------- /js/L.LabelTextCollision.js: -------------------------------------------------------------------------------- 1 | L.LabelTextCollision = L.Canvas 2 | .extend({ 3 | 4 | options : { 5 | /** 6 | * Collision detection 7 | */ 8 | collisionFlg : true 9 | }, 10 | 11 | initialize : function(options) { 12 | options = L.Util.setOptions(this, options); 13 | }, 14 | 15 | _handleMouseHover : function(e, point) { 16 | var id, layer; 17 | 18 | for (id in this._drawnLayers) { 19 | layer = this._drawnLayers[id]; 20 | if (layer.options.interactive 21 | && layer._containsPoint(point)) { 22 | L.DomUtil.addClass(this._containerText, 23 | 'leaflet-interactive'); // change cursor 24 | this._fireEvent([ layer ], e, 'mouseover'); 25 | this._hoveredLayer = layer; 26 | } 27 | } 28 | 29 | if (this._hoveredLayer) { 30 | this._fireEvent([ this._hoveredLayer ], e); 31 | } 32 | }, 33 | 34 | _handleMouseOut : function(e, point) { 35 | var layer = this._hoveredLayer; 36 | if (layer 37 | && (e.type === 'mouseout' || !layer 38 | ._containsPoint(point))) { 39 | // if we're leaving the layer, fire mouseout 40 | L.DomUtil.removeClass(this._containerText, 41 | 'leaflet-interactive'); 42 | this._fireEvent([ layer ], e, 'mouseout'); 43 | this._hoveredLayer = null; 44 | } 45 | }, 46 | 47 | _updateTransform : function(center, zoom) { 48 | 49 | L.Canvas.prototype._updateTransform.call(this, center, zoom); 50 | 51 | var scale = this._map.getZoomScale(zoom, this._zoom), position = L.DomUtil 52 | .getPosition(this._container), viewHalf = this._map 53 | .getSize().multiplyBy(0.5 + this.options.padding), currentCenterPoint = this._map 54 | .project(this._center, zoom), destCenterPoint = this._map 55 | .project(center, zoom), centerOffset = destCenterPoint 56 | .subtract(currentCenterPoint), 57 | 58 | topLeftOffset = viewHalf.multiplyBy(-scale).add(position).add( 59 | viewHalf).subtract(centerOffset); 60 | 61 | if (L.Browser.any3d) { 62 | L.DomUtil.setTransform(this._containerText, topLeftOffset, 63 | scale); 64 | } else { 65 | L.DomUtil.setPosition(this._containerText, topLeftOffset); 66 | } 67 | }, 68 | _initContainer : function(options) { 69 | L.Canvas.prototype._initContainer.call(this); 70 | 71 | this._containerText = document.createElement('canvas'); 72 | 73 | L.DomEvent.on(this._containerText, 'mousemove', 74 | L.Util.throttle(this._onMouseMove, 32, this), this).on( 75 | this._containerText, 76 | 'click dblclick mousedown mouseup contextmenu', 77 | this._onClick, this).on(this._containerText, 78 | 'mouseout', this._handleMouseOut, this); 79 | 80 | this._ctxLabel = this._containerText.getContext('2d'); 81 | 82 | L.DomUtil 83 | .addClass(this._containerText, 'leaflet-zoom-animated'); 84 | this.getPane().appendChild(this._containerText); 85 | 86 | }, 87 | 88 | _update : function() { 89 | // textList 90 | this._textList = []; 91 | 92 | L.Renderer.prototype._update.call(this); 93 | var b = this._bounds, container = this._containerText, size = b 94 | .getSize(), m = L.Browser.retina ? 2 : 1; 95 | 96 | L.DomUtil.setPosition(container, b.min); 97 | 98 | // set canvas size (also clearing it); use double size on retina 99 | container.width = m * size.x; 100 | container.height = m * size.y; 101 | container.style.width = size.x + 'px'; 102 | container.style.height = size.y + 'px'; 103 | 104 | // display text on the whole surface 105 | container.style.zIndex = '4'; 106 | this._container.style.zIndex = '3'; 107 | 108 | if (L.Browser.retina) { 109 | this._ctxLabel.scale(2, 2); 110 | } 111 | 112 | // translate so we use the same path coordinates after canvas 113 | // element moves 114 | this._ctxLabel.translate(-b.min.x, -b.min.y); 115 | L.Canvas.prototype._update.call(this); 116 | 117 | }, 118 | 119 | _updatePoly : function(layer, closed) { 120 | L.Canvas.prototype._updatePoly.call(this, layer, closed); 121 | this._text(this._ctxLabel, layer); 122 | }, 123 | 124 | _updateCircle : function(layer) { 125 | L.Canvas.prototype._updateCircle.call(this, layer); 126 | this._text(this._ctxLabel, layer); 127 | }, 128 | 129 | _text : function(ctx, layer) { 130 | 131 | if (layer.options.text != undefined) { 132 | 133 | ctx.globalAlpha = 1; 134 | 135 | var p = layer._point; 136 | var textPoint; 137 | 138 | if (p == undefined) { 139 | // polygon or polyline 140 | if (layer._parts.length == 0 141 | || layer._parts[0].length == 0) { 142 | return; 143 | } 144 | p = this._getCenter(layer._parts[0]); 145 | } 146 | 147 | // label bounds offset 148 | var offsetX = 0; 149 | var offsetY = 0; 150 | 151 | /** 152 | * TODO setting for custom font 153 | */ 154 | ctx.lineWidth = 4.0; 155 | ctx.font = "16px 'Meiryo'"; 156 | 157 | // Collision detection 158 | var textWidth = (ctx.measureText(layer.options.text).width) 159 | + p.x;// + offsetX; 160 | 161 | var textHeight = p.y + offsetY + 20; 162 | 163 | var bounds = L.bounds( 164 | L.point(p.x + offsetX, p.y + offsetY), L.point( 165 | textWidth, textHeight)); 166 | 167 | if (this.options.collisionFlg) { 168 | 169 | for ( var index in this._textList) { 170 | var pointBounds = this._textList[index]; 171 | if (pointBounds.intersects(bounds)) { 172 | return; 173 | } 174 | } 175 | } 176 | 177 | this._textList.push(bounds); 178 | 179 | ctx.strokeStyle = "white"; 180 | ctx.strokeText(layer.options.text, p.x + offsetX, p.y 181 | + offsetY); 182 | 183 | if (layer.options.textColor == undefined) { 184 | ctx.fillStyle = "blue"; 185 | } else { 186 | ctx.fillStyle = layer.options.textColor; 187 | } 188 | 189 | ctx.fillText(layer.options.text, p.x + offsetX, p.y 190 | + offsetY); 191 | } 192 | }, 193 | 194 | _getCenter : function(points) { 195 | 196 | var i, halfDist, segDist, dist, p1, p2, ratio, len = points.length; 197 | 198 | if (!len) { 199 | return null; 200 | } 201 | 202 | // polyline centroid algorithm; only uses the first ring if 203 | // there are multiple 204 | 205 | for (i = 0, halfDist = 0; i < len - 1; i++) { 206 | halfDist += points[i].distanceTo(points[i + 1]) / 2; 207 | } 208 | 209 | // The line is so small in the current view that all points are 210 | // on the same pixel. 211 | if (halfDist === 0) { 212 | return points[0]; 213 | } 214 | 215 | for (i = 0, dist = 0; i < len - 1; i++) { 216 | p1 = points[i]; 217 | p2 = points[i + 1]; 218 | segDist = p1.distanceTo(p2); 219 | dist += segDist; 220 | 221 | if (dist > halfDist) { 222 | ratio = (dist - halfDist) / segDist; 223 | var resutl = [ p2.x - ratio * (p2.x - p1.x), 224 | p2.y - ratio * (p2.y - p1.y) ]; 225 | 226 | return L.point(resutl[0], resutl[1]); 227 | } 228 | } 229 | }, 230 | 231 | }); 232 | -------------------------------------------------------------------------------- /js/images/marker-icon-2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/js/images/marker-icon-2x.png -------------------------------------------------------------------------------- /js/images/marker-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/js/images/marker-icon.png -------------------------------------------------------------------------------- /js/images/marker-shadow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ZanwingMak/leaflet-image-hotspots/196bbafaa9db6b379745be59eca2c381e54528cd/js/images/marker-shadow.png -------------------------------------------------------------------------------- /js/leaflet.draw.lang.zh-cn.js: -------------------------------------------------------------------------------- 1 | L.drawLocal = { 2 | draw: { 3 | toolbar: { 4 | // #TODO: this should be reorganized where actions are nested in actions 5 | // ex: actions.undo or actions.cancel 6 | actions: { 7 | title: '取消绘制', 8 | text: '取消' 9 | }, 10 | finish: { 11 | title: '完成绘制', 12 | text: '完成' 13 | }, 14 | undo: { 15 | title: '删除最后一个节点', 16 | text: '删除最后一个节点' 17 | }, 18 | buttons: { 19 | polyline: '绘制折线', 20 | polygon: '绘制多边形', 21 | rectangle: '绘制矩形', 22 | circle: '绘制圆形', 23 | marker: '绘制标记' 24 | } 25 | }, 26 | handlers: { 27 | circle: { 28 | tooltip: { 29 | start: '单击并拖动绘制圆形' 30 | }, 31 | radius: '半径' 32 | }, 33 | marker: { 34 | tooltip: { 35 | start: '点击标记' 36 | } 37 | }, 38 | polygon: { 39 | tooltip: { 40 | start: '单击以开始绘制多边形', 41 | cont: '单击以继续绘制多边形', 42 | end: '单击第一个节点闭合该多边形' 43 | } 44 | }, 45 | polyline: { 46 | error: '错误:绘制图形不能有交叉!', 47 | tooltip: { 48 | start: '单击以开始绘制线条', 49 | cont: '单击以继续绘制线条', 50 | end: '单击最后一个点到完成绘制线条' 51 | } 52 | }, 53 | rectangle: { 54 | tooltip: { 55 | start: '单击并拖动以绘制矩形' 56 | } 57 | }, 58 | simpleshape: { 59 | tooltip: { 60 | end: '松开鼠标完成绘制' 61 | } 62 | } 63 | } 64 | }, 65 | edit: { 66 | toolbar: { 67 | actions: { 68 | save: { 69 | title: '保存修改', 70 | text: '保存' 71 | }, 72 | cancel: { 73 | title: '取消编辑,丢弃所有修改', 74 | text: '取消' 75 | } 76 | }, 77 | buttons: { 78 | edit: '修改', 79 | editDisabled: '没有可修改的图层', 80 | remove: '删除', 81 | removeDisabled: '没有可删除的图层' 82 | } 83 | }, 84 | handlers: { 85 | edit: { 86 | tooltip: { 87 | text: '拖动以修改', 88 | subtext: '单击"取消"撤消更改' 89 | } 90 | }, 91 | remove: { 92 | tooltip: { 93 | text: '单击要删除的对象' 94 | } 95 | } 96 | } 97 | } 98 | }; -------------------------------------------------------------------------------- /js/leaflet.label.js: -------------------------------------------------------------------------------- 1 | /* 2 | Leaflet.label, a plugin that adds labels to markers and vectors for Leaflet powered maps. 3 | (c) 2012-2013, Jacob Toye, Smartrak 4 | 5 | https://github.com/Leaflet/Leaflet.label 6 | http://leafletjs.com 7 | https://github.com/jacobtoye 8 | */ 9 | (function(t,e){"function"==typeof define&&define.amd?define(["leaflet"],t):"object"==typeof exports&&(module.exports=t(require("leaflet"))),e!==void 0&&e.L&&(e.LeafletLabel=t(L))})(function(t){t.labelVersion="0.2.4";var e=t.Class.extend({includes:t.Mixin.Events,options:{className:"",clickable:!1,direction:"right",noHide:!1,offset:[12,-15],opacity:1,zoomAnimation:!0},initialize:function(e,i){t.setOptions(this,e),this._source=i,this._animated=t.Browser.any3d&&this.options.zoomAnimation,this._isOpen=!1},onAdd:function(e){this._map=e,this._pane=this.options.pane?e._panes[this.options.pane]:this._source instanceof t.Marker?e._panes.markerPane:e._panes.popupPane,this._container||this._initLayout(),this._pane.appendChild(this._container),this._initInteraction(),this._update(),this.setOpacity(this.options.opacity),e.on("moveend",this._onMoveEnd,this).on("viewreset",this._onViewReset,this),this._animated&&e.on("zoomanim",this._zoomAnimation,this),t.Browser.touch&&!this.options.noHide&&(t.DomEvent.on(this._container,"click",this.close,this),e.on("click",this.close,this))},onRemove:function(t){this._pane.removeChild(this._container),t.off({zoomanim:this._zoomAnimation,moveend:this._onMoveEnd,viewreset:this._onViewReset},this),this._removeInteraction(),this._map=null},setLatLng:function(e){return this._latlng=t.latLng(e),this._map&&this._updatePosition(),this},setContent:function(t){return this._previousContent=this._content,this._content=t,this._updateContent(),this},close:function(){var e=this._map;e&&(t.Browser.touch&&!this.options.noHide&&(t.DomEvent.off(this._container,"click",this.close),e.off("click",this.close,this)),e.removeLayer(this))},updateZIndex:function(t){this._zIndex=t,this._container&&this._zIndex&&(this._container.style.zIndex=t)},setOpacity:function(e){this.options.opacity=e,this._container&&t.DomUtil.setOpacity(this._container,e)},_initLayout:function(){this._container=t.DomUtil.create("div","leaflet-label "+this.options.className+" leaflet-zoom-animated"),this.updateZIndex(this._zIndex)},_update:function(){this._map&&(this._container.style.visibility="hidden",this._updateContent(),this._updatePosition(),this._container.style.visibility="")},_updateContent:function(){this._content&&this._map&&this._prevContent!==this._content&&"string"==typeof this._content&&(this._container.innerHTML=this._content,this._prevContent=this._content,this._labelWidth=this._container.offsetWidth)},_updatePosition:function(){var t=this._map.latLngToLayerPoint(this._latlng);this._setPosition(t)},_setPosition:function(e){var i=this._map,n=this._container,o=i.latLngToContainerPoint(i.getCenter()),s=i.layerPointToContainerPoint(e),a=this.options.direction,l=this._labelWidth,h=t.point(this.options.offset);"right"===a||"auto"===a&&s.xn;n++)t.DomEvent.on(e,i[n],this._fireMouseEvent,this)}},_removeInteraction:function(){if(this.options.clickable){var e=this._container,i=["dblclick","mousedown","mouseover","mouseout","contextmenu"];t.DomUtil.removeClass(e,"leaflet-clickable"),t.DomEvent.off(e,"click",this._onMouseClick,this);for(var n=0;i.length>n;n++)t.DomEvent.off(e,i[n],this._fireMouseEvent,this)}},_onMouseClick:function(e){this.hasEventListeners(e.type)&&t.DomEvent.stopPropagation(e),this.fire(e.type,{originalEvent:e})},_fireMouseEvent:function(e){this.fire(e.type,{originalEvent:e}),"contextmenu"===e.type&&this.hasEventListeners(e.type)&&t.DomEvent.preventDefault(e),"mousedown"!==e.type?t.DomEvent.stopPropagation(e):t.DomEvent.preventDefault(e)}});return t.BaseMarkerMethods={showLabel:function(){return this.label&&this._map&&(this.label.setLatLng(this._latlng),this._map.showLabel(this.label)),this},hideLabel:function(){return this.label&&this.label.close(),this},setLabelNoHide:function(t){this._labelNoHide!==t&&(this._labelNoHide=t,t?(this._removeLabelRevealHandlers(),this.showLabel()):(this._addLabelRevealHandlers(),this.hideLabel()))},bindLabel:function(i,n){var o=this.options.icon?this.options.icon.options.labelAnchor:this.options.labelAnchor,s=t.point(o)||t.point(0,0);return s=s.add(e.prototype.options.offset),n&&n.offset&&(s=s.add(n.offset)),n=t.Util.extend({offset:s},n),this._labelNoHide=n.noHide,this.label||(this._labelNoHide||this._addLabelRevealHandlers(),this.on("remove",this.hideLabel,this).on("move",this._moveLabel,this).on("add",this._onMarkerAdd,this),this._hasLabelHandlers=!0),this.label=new e(n,this).setContent(i),this},unbindLabel:function(){return this.label&&(this.hideLabel(),this.label=null,this._hasLabelHandlers&&(this._labelNoHide||this._removeLabelRevealHandlers(),this.off("remove",this.hideLabel,this).off("move",this._moveLabel,this).off("add",this._onMarkerAdd,this)),this._hasLabelHandlers=!1),this},updateLabelContent:function(t){this.label&&this.label.setContent(t)},getLabel:function(){return this.label},_onMarkerAdd:function(){this._labelNoHide&&this.showLabel()},_addLabelRevealHandlers:function(){this.on("mouseover",this.showLabel,this).on("mouseout",this.hideLabel,this),t.Browser.touch&&this.on("click",this.showLabel,this)},_removeLabelRevealHandlers:function(){this.off("mouseover",this.showLabel,this).off("mouseout",this.hideLabel,this),t.Browser.touch&&this.off("click",this.showLabel,this)},_moveLabel:function(t){this.label.setLatLng(t.latlng)}},t.Icon.Default.mergeOptions({labelAnchor:new t.Point(9,-20)}),t.Marker.mergeOptions({icon:new t.Icon.Default}),t.Marker.include(t.BaseMarkerMethods),t.Marker.include({_originalUpdateZIndex:t.Marker.prototype._updateZIndex,_updateZIndex:function(t){var e=this._zIndex+t;this._originalUpdateZIndex(t),this.label&&this.label.updateZIndex(e)},_originalSetOpacity:t.Marker.prototype.setOpacity,setOpacity:function(t,e){this.options.labelHasSemiTransparency=e,this._originalSetOpacity(t)},_originalUpdateOpacity:t.Marker.prototype._updateOpacity,_updateOpacity:function(){var t=0===this.options.opacity?0:1;this._originalUpdateOpacity(),this.label&&this.label.setOpacity(this.options.labelHasSemiTransparency?this.options.opacity:t)},_originalSetLatLng:t.Marker.prototype.setLatLng,setLatLng:function(t){return this.label&&!this._labelNoHide&&this.hideLabel(),this._originalSetLatLng(t)}}),t.CircleMarker.mergeOptions({labelAnchor:new t.Point(0,0)}),t.CircleMarker.include(t.BaseMarkerMethods),t.Path.include({bindLabel:function(i,n){return this.label&&this.label.options===n||(this.label=new e(n,this)),this.label.setContent(i),this._showLabelAdded||(this.on("mouseover",this._showLabel,this).on("mousemove",this._moveLabel,this).on("mouseout remove",this._hideLabel,this),t.Browser.touch&&this.on("click",this._showLabel,this),this._showLabelAdded=!0),this},unbindLabel:function(){return this.label&&(this._hideLabel(),this.label=null,this._showLabelAdded=!1,this.off("mouseover",this._showLabel,this).off("mousemove",this._moveLabel,this).off("mouseout remove",this._hideLabel,this)),this},updateLabelContent:function(t){this.label&&this.label.setContent(t)},_showLabel:function(t){this.label.setLatLng(t.latlng),this._map.showLabel(this.label)},_moveLabel:function(t){this.label.setLatLng(t.latlng)},_hideLabel:function(){this.label.close()}}),t.Map.include({showLabel:function(t){return this.addLayer(t)}}),t.FeatureGroup.include({clearLayers:function(){return this.unbindLabel(),this.eachLayer(this.removeLayer,this),this},bindLabel:function(t,e){return this.invoke("bindLabel",t,e)},unbindLabel:function(){return this.invoke("unbindLabel")},updateLabelContent:function(t){this.invoke("updateLabelContent",t)}}),e},window); -------------------------------------------------------------------------------- /js/pinyinUtil.js: -------------------------------------------------------------------------------- 1 | /** 2 | * 汉字与拼音互转工具,根据导入的字典文件的不同支持不同 3 | * 对于多音字目前只是将所有可能的组合输出,准确识别多音字需要完善的词库,而词库文件往往比字库还要大,所以不太适合web环境。 4 | * @start 2016-09-26 5 | * @last 2016-09-29 6 | */ 7 | ;(function() 8 | { 9 | var dict = {}; // 存储所有字典数据 10 | var pinyinUtil = 11 | { 12 | /** 13 | * 解析各种字典文件,所需的字典文件必须在本JS之前导入 14 | */ 15 | parseDict: function() 16 | { 17 | // 如果导入了 pinyin_dict_firstletter.js 18 | if(window.pinyin_dict_firstletter) 19 | { 20 | dict.firstletter = pinyin_dict_firstletter; 21 | } 22 | // 如果导入了 pinyin_dict_notone.js 23 | if(window.pinyin_dict_notone) 24 | { 25 | dict.notone = {}; 26 | dict.py2hz = pinyin_dict_notone; // 拼音转汉字 27 | for(var i in pinyin_dict_notone) 28 | { 29 | var temp = pinyin_dict_notone[i]; 30 | for(var j=0, len=temp.length; j 汉字 48 | if(window.pinyin_dict_notone) 49 | { 50 | // 对于拼音转汉字,我们优先使用pinyin_dict_notone字典文件 51 | // 因为这个字典文件不包含生僻字,且已按照汉字使用频率排序 52 | dict.py2hz = pinyin_dict_notone; // 拼音转汉字 53 | } 54 | else 55 | { 56 | // 将字典文件解析成拼音->汉字的结构 57 | // 与先分割后逐个去掉声调相比,先一次性全部去掉声调然后再分割速度至少快了3倍,前者大约需要120毫秒,后者大约只需要30毫秒(Chrome下) 58 | var notone = pinyinUtil.removeTone(pinyin_dict_withtone).split(','); 59 | var py2hz = {}, py, hz; 60 | for(var i=0, len = notone.length; i= 19968 && unicode <= 40869) 139 | { 140 | ch = dict.firstletter.all.charAt(unicode-19968); 141 | if(polyphone) ch = dict.firstletter.polyphone[unicode] || ch; 142 | } 143 | result.push(ch); 144 | } 145 | if(!polyphone) return result.join(''); // 如果不用管多音字,直接将数组拼接成字符串 146 | else return handlePolyphone(result, '', ''); // 处理多音字,此时的result类似于:['D', 'ZC', 'F'] 147 | } 148 | else 149 | { 150 | var py = this.getPinyin(str, ' ', false, polyphone); 151 | py = py instanceof Array ? py : [py]; 152 | var result = []; 153 | for(var i=0; i=0;)n=n.replace(" "+t+" "," ");e.className=n.replace(/^\s+|\s+$/g,"")}},i=function(e){var n=t.createElement("div");return n.appendChild(t.createTextNode(e)),n.innerHTML},u=function(e){e.style.opacity="",e.style.display="block"},c=function(e){if(e&&!e.length)return u(e);for(var t=0;t0?setTimeout(a,t):e.style.display="none"};o()},b=function(n){if("function"==typeof MouseEvent){var o=new MouseEvent("click",{view:e,bubbles:!1,cancelable:!0});n.dispatchEvent(o)}else if(t.createEvent){var a=t.createEvent("MouseEvents");a.initEvent("click",!1,!1),n.dispatchEvent(a)}else t.createEventObject?n.fireEvent("onclick"):"function"==typeof n.onclick&&n.onclick()},h=function(t){"function"==typeof t.stopPropagation?(t.stopPropagation(),t.preventDefault()):e.event&&e.event.hasOwnProperty("cancelBubble")&&(e.event.cancelBubble=!0)};a.hasClass=r,a.addClass=s,a.removeClass=l,a.escapeHtml=i,a._show=u,a.show=c,a._hide=d,a.hide=f,a.isDescendant=p,a.getTopMargin=m,a.fadeIn=v,a.fadeOut=y,a.fireClick=b,a.stopEventPropagation=h},{}],5:[function(t,o,a){Object.defineProperty(a,"__esModule",{value:!0});var r=t("./handle-dom"),s=t("./handle-swal-dom"),l=function(t,o,a){var l=t||e.event,i=l.keyCode||l.which,u=a.querySelector("button.confirm"),c=a.querySelector("button.cancel"),d=a.querySelectorAll("button[tabindex]");if(-1!==[9,13,32,27].indexOf(i)){for(var f=l.target||l.srcElement,p=-1,m=0;m"),i.innerHTML=e.html?e.text:(0,s.escapeHtml)(e.text||"").split("\n").join("
"),e.text&&(0,s.show)(i),e.customClass)(0,s.addClass)(t,e.customClass),t.setAttribute("data-custom-class",e.customClass);else{var d=t.getAttribute("data-custom-class");(0,s.removeClass)(t,d),t.setAttribute("data-custom-class","")}if((0,s.hide)(t.querySelectorAll(".sa-icon")),e.type&&!(0,a.isIE8)()){var f=function(){for(var o=!1,a=0;ao;o++)n=parseInt(e.substr(2*o,2),16),n=Math.round(Math.min(Math.max(0,n+n*t),255)).toString(16),a+=("00"+n).substr(n.length);return a};o.extend=a,o.hexToRgb=r,o.isIE8=s,o.logStr=l,o.colorLuminance=i},{}]},{},[1]),"function"==typeof define&&define.amd?define(function(){return sweetAlert}):"undefined"!=typeof module&&module.exports&&(module.exports=sweetAlert)}(window,document); -------------------------------------------------------------------------------- /js/sweetalert2.min.js: -------------------------------------------------------------------------------- 1 | !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.Sweetalert2=t()}(this,function(){"use strict";var e={title:"",titleText:"",text:"",html:"",type:null,customClass:"",target:"body",animation:!0,allowOutsideClick:!0,allowEscapeKey:!0,allowEnterKey:!0,showConfirmButton:!0,showCancelButton:!1,preConfirm:null,confirmButtonText:"OK",confirmButtonColor:"#3085d6",confirmButtonClass:null,cancelButtonText:"Cancel",cancelButtonColor:"#aaa",cancelButtonClass:null,buttonsStyling:!0,reverseButtons:!1,focusCancel:!1,showCloseButton:!1,showLoaderOnConfirm:!1,imageUrl:null,imageWidth:null,imageHeight:null,imageClass:null,timer:null,width:500,padding:20,background:"#fff",input:null,inputPlaceholder:"",inputValue:"",inputOptions:{},inputAutoTrim:!0,inputClass:null,inputAttributes:{},inputValidator:null,progressSteps:[],currentProgressStep:null,progressStepsDistance:"40px",onOpen:null,onClose:null,useRejections:!0},t=function(e){var t={};for(var n in e)t[e[n]]="swal2-"+e[n];return t},n=t(["container","shown","iosfix","modal","overlay","fade","show","hide","noanimation","close","title","content","buttonswrapper","confirm","cancel","icon","image","input","file","range","select","radio","checkbox","textarea","inputerror","validationerror","progresssteps","activeprogressstep","progresscircle","progressline","loading","styled"]),o=t(["success","warning","info","question","error"]),r=function(e,t){(e=String(e).replace(/[^0-9a-f]/gi,"")).length<6&&(e=e[0]+e[0]+e[1]+e[1]+e[2]+e[2]),t=t||0;for(var n="#",o=0;o<3;o++){var r=parseInt(e.substr(2*o,2),16);n+=("00"+(r=Math.round(Math.min(Math.max(0,r+r*t),255)).toString(16))).substr(r.length)}return n},i=function(e){var t=[];for(var n in e)-1===t.indexOf(e[n])&&t.push(e[n]);return t},a={previousWindowKeyDown:null,previousActiveElement:null,previousBodyPadding:null},l=function(e){if("undefined"!=typeof document){var t=document.createElement("div");t.className=n.container,t.innerHTML=s;var o=document.querySelector(e.target);o||(console.warn("SweetAlert2: Can't find the target \""+e.target+'"'),o=document.body),o.appendChild(t);var r=c(),i=A(r,n.input),a=A(r,n.file),l=r.querySelector("."+n.range+" input"),u=r.querySelector("."+n.range+" output"),d=A(r,n.select),p=r.querySelector("."+n.checkbox+" input"),f=A(r,n.textarea);return i.oninput=function(){$.resetValidationError()},i.onkeydown=function(t){setTimeout(function(){13===t.keyCode&&e.allowEnterKey&&(t.stopPropagation(),$.clickConfirm())},0)},a.onchange=function(){$.resetValidationError()},l.oninput=function(){$.resetValidationError(),u.value=l.value},l.onchange=function(){$.resetValidationError(),l.previousSibling.value=l.value},d.onchange=function(){$.resetValidationError()},p.onchange=function(){$.resetValidationError()},f.oninput=function(){$.resetValidationError()},r}console.error("SweetAlert2 requires document to initialize")},s=('\n \n').replace(/(^|\n)\s*/g,""),u=function(){return document.body.querySelector("."+n.container)},c=function(){return u()?u().querySelector("."+n.modal):null},d=function(){return c().querySelectorAll("."+n.icon)},p=function(e){return u()?u().querySelector("."+e):null},f=function(){return p(n.title)},m=function(){return p(n.content)},v=function(){return p(n.image)},h=function(){return p(n.buttonswrapper)},g=function(){return p(n.progresssteps)},y=function(){return p(n.validationerror)},b=function(){return p(n.confirm)},w=function(){return p(n.cancel)},C=function(){return p(n.close)},k=function(e){var t=[b(),w()];e&&t.reverse();var n=t.concat(Array.prototype.slice.call(c().querySelectorAll('button, input:not([type=hidden]), textarea, select, a, *[tabindex]:not([tabindex="-1"])')));return i(n)},x=function(e,t){return!!e.classList&&e.classList.contains(t)},S=function(e){if(e.focus(),"file"!==e.type){var t=e.value;e.value="",e.value=t}},E=function(e,t){e&&t&&t.split(/\s+/).filter(Boolean).forEach(function(t){e.classList.add(t)})},B=function(e,t){e&&t&&t.split(/\s+/).filter(Boolean).forEach(function(t){e.classList.remove(t)})},A=function(e,t){for(var n=0;n"),t.text||t.html){if("object"===R(t.html))if(p.innerHTML="",0 in t.html)for(var A=0;A in t.html;A++)p.appendChild(t.html[A].cloneNode(!0));else p.appendChild(t.html.cloneNode(!0));else t.html?p.innerHTML=t.html:t.text&&(p.textContent=t.text);P(p)}else T(p);t.showCloseButton?P(S):T(S),r.className=n.modal,t.customClass&&E(r,t.customClass);var M=g(),V=parseInt(null===t.currentProgressStep?$.getQueueStep():t.currentProgressStep,10);t.progressSteps.length?(P(M),L(M),V>=t.progressSteps.length&&console.warn("SweetAlert2: Invalid currentProgressStep parameter, it should be less than progressSteps.length (currentProgressStep like JS arrays starts from 0)"),t.progressSteps.forEach(function(e,o){var r=document.createElement("li");if(E(r,n.progresscircle),r.innerHTML=e,o===V&&E(r,n.activeprogressstep),M.appendChild(r),o!==t.progressSteps.length-1){var i=document.createElement("li");E(i,n.progressline),i.style.width=t.progressStepsDistance,M.appendChild(i)}})):T(M);for(var O=d(),H=0;Hwindow.innerHeight&&(a.previousBodyPadding=document.body.style.paddingRight,document.body.style.paddingRight=N()+"px")},Q=function(){null!==a.previousBodyPadding&&(document.body.style.paddingRight=a.previousBodyPadding,a.previousBodyPadding=null)},Y=function(){if(/iPad|iPhone|iPod/.test(navigator.userAgent)&&!window.MSStream&&!x(document.body,n.iosfix)){var e=document.body.scrollTop;document.body.style.top=-1*e+"px",E(document.body,n.iosfix)}},_=function(){if(x(document.body,n.iosfix)){var e=parseInt(document.body.style.top,10);B(document.body,n.iosfix),document.body.style.top="",document.body.scrollTop=-1*e}},$=function e(){for(var t=arguments.length,o=Array(t),i=0;i