123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329 |
- L.Control.Zoomslider = (function () {
- var Knob = L.Draggable.extend({
- initialize: function (element, stepHeight, knobHeight,minZ,maxZ,knobBgElement) {
- L.Draggable.prototype.initialize.call(this, element, element);
- this._element = element;
- this._minZ = minZ;
- this._maxZ = maxZ;
- this._stepHeight = stepHeight;
- this._knobHeight = knobHeight;
- this._knobBgElement = knobBgElement;
- this.on('predrag', function () {
- this._newPos.x = 0;
- this._newPos.y = this._adjust(this._newPos.y);
- }, this);
- },
- _adjust: function (y) {
- var value = Math.round(this._toValue(y));
- value = Math.max(0, Math.min(this._maxValue, value));
- this.setValueTxt(value + this._minZ);
- return this._toY(value);
- },
- // y = k*v + m
- _toY: function (value) {
- return this._k * value + this._m;
- },
- // v = (y - m) / k
- _toValue: function (y) {
- return (y - this._m) / this._k;
- },
- setSteps: function (steps) {
- var sliderHeight = steps * this._stepHeight;
- this._maxValue = steps - 1;
- // conversion parameters
- // the conversion is just a common linear function.
- this._k = -this._stepHeight;
- this._m = sliderHeight - (this._stepHeight + this._knobHeight) / 2;
- },
- setZoomScope:function(minZ,maxZ){
- this._minZ = minZ;
- this._maxZ = maxZ;
- },
- setPosition: function (y) {
- L.DomUtil.setPosition(this._element,
- L.point(0, this._adjust(y)));
- },
- setValue: function (v) {
- this.setPosition(this._toY(v));
- },
- getValue: function () {
- return this._toValue(L.DomUtil.getPosition(this._element).y);
- },
-
-
- //todo 仅标记**********== 修改的内容 ==**********
- /*S add by Song.Huang*/
- setValueTxt:function(t){
- this._element.innerHTML = t;
- this._knobBgElement.style.height = (this._maxZ - t)*this._stepHeight + 'px';
- }
- /*E add by Song.Huang*/
-
-
- });
- var Zoomslider = L.Control.extend({
- options: {
- position: 'topleft',
- // Height of zoom-slider.png in px
- stepHeight: 7,
- // Height of the knob div in px (including border)
- knobHeight: 13,
- styleNS: 'leaflet-control-zoomslider'
- },
- _overTimeOut:null,
- onAdd: function (map) {
- this._map = map;
- this._ui = this._createUI();
- this._knob = new Knob(this._ui.knob,
- this.options.stepHeight,
- this.options.knobHeight,map.getMinZoom(),map.getMaxZoom(),this._ui.knobBg);
- map .whenReady(this._initKnob, this)
- .whenReady(this._initEvents, this)
- .whenReady(this._updateSize, this)
- .whenReady(this._updateKnobValue, this)
- .whenReady(this._updateDisabled, this);
- return this._ui.bar;
- },
- onRemove: function (map) {
- map .off('zoomlevelschange', this._updateSize, this)
- .off('zoomend zoomlevelschange', this._updateKnobValue, this)
- .off('zoomend zoomlevelschange', this._updateDisabled, this);
- },
- _createUI: function () {
- var _this = this;
- var ui = {},
- ns = this.options.styleNS;
- ui.bar = L.DomUtil.create('div', ns + ' leaflet-bar'),
- ui.wrap = L.DomUtil.create('div', ns + '-wrap leaflet-bar-part', ui.bar),
- ui.zoomIn = this._createZoomBtn('in', 'top', ui.bar),
- ui.zoomOut = this._createZoomBtn('out', 'bottom', ui.bar),
- ui.body = L.DomUtil.create('div', ns + '-body', ui.wrap),
- ui.knobBg = L.DomUtil.create('div', ns + '-knob-bg'),
- ui.knob = L.DomUtil.create('div', ns + '-knob');
- L.DomEvent.disableClickPropagation(ui.bar);
- L.DomEvent.disableClickPropagation(ui.knob);
- L.DomEvent.on(ui.bar,'contextmenu',L.DomEvent.stopPropagation);
- //todo 仅标记**********== 修改的内容 ==**********
- /*S add by Song.Huang*/
- this._barJump = L.DomUtil.create('div','leaflet-bar-p-pic',ui.bar);
- this._barJump_country = L.DomUtil.create('span','bj_country', this._barJump);
- this._barJump_province = L.DomUtil.create('span','bj_province', this._barJump);
- this._barJump_city = L.DomUtil.create('span','bj_city', this._barJump);
- this._barJump_street = L.DomUtil.create('span','bj_street', this._barJump);
- L.DomEvent.on(ui.bar,"mouseover",function(){
- if(_this._overTimeOut !== null){
- clearTimeout(_this._overTimeOut);
- _this._overTimeOut = null;
- }
- L.DomUtil.addClass(ui.bar,'over');
- }).on(ui.bar,"mouseout",function(){
- clearTimeout(_this._overTimeOut);
- _this._overTimeOut = setTimeout(function() {
- L.DomUtil.removeClass(ui.bar, 'over');
- },100);
- });
- /*E add by Song.Huang*/
- return ui;
- },
- _createZoomBtn: function (zoomDir, end, container) {
- var classDef = this.options.styleNS + '-' + zoomDir
- + ' leaflet-bar-part'
- + ' leaflet-bar-part-' + end,
- link = L.DomUtil.create('a', classDef, container);
- //link.href = '#';
- switch (zoomDir){
- case 'out':
- link.title = "缩小";
- link.innerHTML = "-";
- break;
- case 'in':
- link.title = "放大";
- link.innerHTML = "+";
- }
- //link.title = 'Zoom ' + zoomDir;
- L.DomEvent.on(link, 'click', L.DomEvent.preventDefault);
- return link;
- },
- _initKnob: function () {
- this._knob.enable();
- //this._ui.body.appendChild(this._ui.knobBg);
- this._ui.body.appendChild(this._ui.knob);
- },
- _initEvents: function () {
- this._map
- .on('zoomlevelschange', this._updateSize, this)
- .on('zoomend zoomlevelschange', this._updateKnobValue, this)
- .on('zoomend zoomlevelschange', this._updateDisabled, this);
-
-
- //todo 仅标记**********== 修改的内容 ==**********
- /*S add by Song.Huang*/
- var _this = this;
-
- this._map.on('zoomstart',function(){
- L.DomUtil.addClass(this._ui.bar,'over');
- if(this.options.timeOut){
- clearTimeout(this.options.timeOut);
- this.options.timeOut = setTimeout(function(){
- L.DomUtil.removeClass(_this._ui.bar,'over');
- },2000);
- }else {
- this.options.timeOut = setTimeout(function(){
- L.DomUtil.removeClass(_this._ui.bar,'over');
- },2000);
- }
- },this);
- L.DomEvent.on(this._barJump_country,'click',function(){
- this._map.setZoom(3);
- },this);
- L.DomEvent.on(this._barJump_province,'click',function(){
- this._map.setZoom(7);
- },this);
- L.DomEvent.on(this._barJump_city,'click',function(){
- this._map.setZoom(11);
- },this);
- L.DomEvent.on(this._barJump_street,'click',function(){
- this._map.setZoom(17);
- },this);
- /*E add by Song.Huang*/
-
-
- //L.DomEvent.on(this._ui.body, 'click', this._onSliderClick, this);
- L.DomEvent.on(this._ui.zoomIn, 'click', this._zoomIn, this);
- L.DomEvent.on(this._ui.zoomOut, 'click', this._zoomOut, this);
- this._knob.on('dragend', this._updateMapZoom, this);
- //todo 仅标记**********== 修改的内容 ==**********
- /*S add by Song.Huang*/
- //this._knob.on('drag',this.,this);
- /*E add by Song.Huang*/
- },
- /*_onSliderClick: function (e) {
- var first = (e.touches && e.touches.length === 1 ? e.touches[0] : e),
- y = L.DomEvent.getMousePosition(first).y
- - L.DomUtil.getViewportOffset(this._ui.body).y; // Cache this?
- this._knob.setPosition(y);
- this._updateMapZoom();
- },*/
- _zoomIn: function (e) {
- this._map.zoomIn(e.shiftKey ? 3 : 1);
- },
- _zoomOut: function (e) {
- this._map.zoomOut(e.shiftKey ? 3 : 1);
- },
- _zoomLevels: function () {
- var zoomLevels = this._map.getMaxZoom() - this._map.getMinZoom() + 1;
- return zoomLevels < Infinity ? zoomLevels : 0;
- },
- _toZoomLevel: function (value) {
- return value + this._map.getMinZoom();
- },
- _toValue: function (zoomLevel) {
- return zoomLevel - this._map.getMinZoom();
- },
- _updateSize: function () {
- this._knob.setZoomScope(this._map.getMinZoom(),this._map.getMaxZoom());
- var steps = this._zoomLevels();
- //this._ui.body.style.height = this.options.stepHeight * steps + 1+'px';
- //this._knob.setSteps(steps);
- if(this._map.getMaxZoom() != 19 || this._map.getMinZoom() != 1){
- this._barJump.style.visibility = 'visible';
- }else {
- this._barJump.style.visibility = 'visible';
- }
- },
- _updateMapZoom: function () {
- this._map.setZoom(this._toZoomLevel(this._knob.getValue()));
- },
- _updateKnobValue: function () {
- this._knob.setValue(this._toValue(this._map.getZoom()));
-
-
- //todo 仅标记**********== 修改的内容 ==**********
- /*S add by Song.Huang*/
- this._knob.setValueTxt(this._map.getZoom());
- /*E add by Song.Huang*/
-
- },
- _updateDisabled: function () {
- var zoomLevel = this._map.getZoom(),
- className = this.options.styleNS + '-disabled';
- L.DomUtil.removeClass(this._ui.zoomIn, className);
- L.DomUtil.removeClass(this._ui.zoomOut, className);
- if (zoomLevel === this._map.getMinZoom()) {
- L.DomUtil.addClass(this._ui.zoomOut, className);
- }
- if (zoomLevel === this._map.getMaxZoom()) {
- L.DomUtil.addClass(this._ui.zoomIn, className);
- }
- }
- });
- return Zoomslider;
- })();
- L.Map.mergeOptions({
- zoomControl: false,
- zoomsliderControl: false
- });
- L.Map.addInitHook(function () {
- if (this.options.zoomsliderControl) {
- this.zoomsliderControl = new L.Control.Zoomslider();
- this.addControl(this.zoomsliderControl);
- }
- });
- L.control.zoomslider = function (options) {
- return new L.Control.Zoomslider(options);
- };
|