Skip to content

Commit ddbafff

Browse files
zmofeizmofei
committed
Merge branch 'master' of https://github.com/huiyan-fe/mapv 
2 parents b1517e0 + bbd9eb3 commit ddbafff

10 files changed

Lines changed: 316 additions & 231 deletions

File tree

‎dist/Mapv.js‎

Lines changed: 142 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -387,6 +387,8 @@
387387
})();
388388

389389
})();
390+
391+
Mapv.MVCObject = MVCObject;
390392
;function Class () {
391393
this.__listeners = {}; // 存储自定义事件对象
392394
}
@@ -465,16 +467,20 @@ Class.prototype.dispose = function () {
465467
function Mapv(options) {
466468
Class.call(this);
467469

468-
this.initOptions({
470+
this.initOptions($.extend({
469471
map: null, //地图参数
472+
drawTypeControl: false,
473+
drawTypeControlOptions: {
474+
a: 1
475+
},
470476
dataRangeCtrol: null
471-
});
477+
}, options));
472478

473-
this.setOptions(options);
474479
this._layers = [];
475480
this._initDrawScale();
476481
// this._initDataRange();
477-
// this._initDrawTypeControl();
482+
483+
this.notify('drawTypeControl');
478484
}
479485

480486
util.inherits(Mapv, Class);
@@ -488,12 +494,78 @@ Mapv.prototype._initDataRange = function () {
488494
this.getMap().addControl(this.getDataRangeCtrol());
489495
}
490496

491-
Mapv.prototype._initDrawTypeControl = function () {
492-
this._drawTypeControl = new DrawTypeControl({
493-
mapv: this
494-
});
495-
this.getMap().addControl(this._drawTypeControl);
496-
};
497+
Mapv.prototype.drawTypeControl_changed = function () {
498+
if (this.getDrawTypeControl()) {
499+
console.log(this.getMap());
500+
if (!this.drawTypeControl) {
501+
this.drawTypeControl = new DrawTypeControl({
502+
mapv: this
503+
});
504+
}
505+
this.getMap().addControl(this.drawTypeControl);
506+
} else {
507+
if (this.drawTypeControl) {
508+
this.getMap().removeControl(this.drawTypeControl);
509+
}
510+
}
511+
}
512+
;function CanvasLayer(options){
513+
this.options = options || {};
514+
this.paneName = this.options.paneName || 'labelPane';
515+
this.zIndex = this.options.zIndex || 0;
516+
this._map = options.map;
517+
this.show();
518+
}
519+
520+
CanvasLayer.prototype = new BMap.Overlay();
521+
522+
CanvasLayer.prototype.initialize = function(map){
523+
this._map = map;
524+
var canvas = this.canvas = document.createElement("canvas");
525+
var size = map.getSize();
526+
canvas.width = size.width;
527+
canvas.height = size.height;
528+
canvas.style.cssText = "position:absolute;"
529+
+ "left:0;"
530+
+ "top:0;"
531+
+ "z-index:" + this.zIndex + ";"
532+
+ "width:" + size.width + "px;"
533+
+ "height:" + size.height + "px";
534+
map.getPanes()[this.paneName].appendChild(canvas);
535+
return this.canvas;
536+
}
537+
538+
CanvasLayer.prototype.draw = function(){
539+
var map = this._map;
540+
var bounds = map.getBounds();
541+
var sw = bounds.getSouthWest();
542+
var ne = bounds.getNorthEast();
543+
var pixel = map.pointToOverlayPixel(new BMap.Point(sw.lng, ne.lat));
544+
this.canvas.style.left = pixel.x + "px";
545+
this.canvas.style.top = pixel.y + "px";
546+
this.dispatchEvent('draw');
547+
this.options.update && this.options.update.call(this);
548+
}
549+
550+
CanvasLayer.prototype.getContainer = function(){
551+
return this.canvas;
552+
}
553+
554+
CanvasLayer.prototype.show = function(){
555+
this._map.addOverlay(this);
556+
}
557+
558+
CanvasLayer.prototype.hide = function(){
559+
this._map.removeOverlay(this);
560+
}
561+
562+
CanvasLayer.prototype.setZIndex = function(zIndex){
563+
this.canvas.style.zIndex = zIndex;
564+
}
565+
566+
CanvasLayer.prototype.getZIndex = function(){
567+
return this.zIndex;
568+
}
497569
;function Layer (options) {
498570
Class.call(this);
499571

@@ -525,40 +597,45 @@ util.inherits(Layer, Class);
525597

526598
util.extend(Layer.prototype, {
527599
initialize: function () {
528-
if (this.mapMask) {
600+
if (this.canvasLayer) {
529601
return;
530602
}
531603

532604
this.setMap(this.getMapv().getMap());
533605
this.bindTo('map', this.getMapv());
534606

535-
this.mapMask = new MapMask({
607+
var that = this;
608+
609+
this.canvasLayer = new CanvasLayer({
536610
map: this.getMapv().getMap(),
537611
zIndex: this.getZIndex(),
612+
update: function () {
613+
that.draw();
614+
},
538615
elementTag: "canvas"
539616
});
540617

541-
this.setCtx(this.mapMask.getContainer().getContext("2d"));
542-
543-
var that = this;
544-
this.mapMask.addEventListener('draw', function () {
545-
that.draw();
546-
});
618+
this.setCtx(this.canvasLayer.getContainer().getContext("2d"));
547619

548620
if (this.getAnimation()) {
549-
this.animationMask = new MapMask({
621+
this.animationLayer = new CanvasLayer({
550622
map: this.getMapv().getMap(),
551623
zIndex: this.getZIndex(),
552624
elementTag: "canvas"
553625
});
554626

555-
this.setAnimationCtx(this.animationMask.getContainer().getContext("2d"));
627+
this.setAnimationCtx(this.animationLayer.getContainer().getContext("2d"));
556628
}
557629

558630
},
559631

560-
draw: function () {
632+
draw: function (ctx) {
561633
var ctx = this.getCtx();
634+
635+
if (!ctx) {
636+
return false;
637+
}
638+
562639
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
563640
this._calculatePixel();
564641

@@ -573,6 +650,11 @@ util.extend(Layer.prototype, {
573650

574651
drawAnimation: function () {
575652
var animationCtx = this.getAnimationCtx();
653+
654+
if (!animationCtx ) {
655+
return false;
656+
}
657+
576658
animationCtx.clearRect(0, 0, animationCtx.canvas.width, animationCtx.canvas.height);
577659

578660
var that = this;
@@ -593,10 +675,10 @@ util.extend(Layer.prototype, {
593675

594676
mapv_changed: function () {
595677
if (!this.getMapv()) {
596-
this.mapMask && this.mapMask.hide();
678+
this.canvasLayer && this.canvasLayer.hide();
597679
return;
598680
} else {
599-
this.mapMask && this.mapMask.show();
681+
this.canvasLayer && this.canvasLayer.show();
600682
}
601683

602684
this.initialize();
@@ -641,7 +723,6 @@ util.extend(Layer.prototype, {
641723
});
642724
funcName += 'Drawer';
643725
var drawer = this._drawer[drawType] = eval('(new ' + funcName + '(this))');
644-
drawer.setDrawOptions(this.getDrawOptions()/*[drawType]*/);
645726
if (drawer.scale) {
646727
drawer.scale(this.getMapv().Scale);
647728
this.getMapv().Scale.show();
@@ -710,77 +791,11 @@ util.extend(Layer.prototype, {
710791
min: this._min,
711792
max: this._max
712793
};
713-
}
714-
});
715-
716-
util.extend(Mapv.prototype, {
717-
addLayer: function (layer) {
718-
this._layers.push(layer);
719-
layer._layerAdd(this);
720794
},
721-
removeLayer: function (layer) {
722-
for (var i = this._layers.length--; i >= 0; i--) {
723-
if (this._layers[i] === layer) {
724-
this._layers.splice(i, 1);
725-
}
726-
}
795+
zIndex_changed: function (zIndex) {
796+
this.canvasLayer.setZIndex(zIndex);
727797
}
728798
});
729-
;function MapMask(options){
730-
this.options = options || {};
731-
this.initElement();
732-
this._map = options.map;
733-
this.show();
734-
}
735-
736-
MapMask.prototype = new BMap.Overlay();
737-
MapMask.prototype.initialize = function(map){
738-
this._map = map;
739-
var elementTag = this.options.elementTag || "div";
740-
var element = this.element = document.createElement(elementTag);
741-
var size = map.getSize();
742-
element.width = size.width;
743-
element.height = size.height;
744-
element.style.cssText = "position:absolute;"
745-
+ "left:0;"
746-
+ "top:0;"
747-
+ "width:" + size.width + "px;"
748-
+ "height:" + size.height + "px";
749-
750-
if (this.options.zIndex !== undefined) {
751-
element.style.zIndex = this.options.zIndex;
752-
}
753-
754-
map.getPanes().labelPane.appendChild(this.element);
755-
return this.element;
756-
}
757-
758-
MapMask.prototype.initElement = function(map){
759-
}
760-
761-
MapMask.prototype.draw = function(){
762-
var map = this._map;
763-
var bounds = map.getBounds();
764-
var sw = bounds.getSouthWest();
765-
var ne = bounds.getNorthEast();
766-
var pixel = map.pointToOverlayPixel(new BMap.Point(sw.lng, ne.lat));
767-
this.element.style.left = pixel.x + "px";
768-
this.element.style.top = pixel.y + "px";
769-
this.dispatchEvent('draw');
770-
}
771-
772-
MapMask.prototype.getContainer = function(){
773-
return this.element;
774-
}
775-
776-
MapMask.prototype.show = function(){
777-
this._map.addOverlay(this);
778-
}
779-
780-
MapMask.prototype.hide = function(){
781-
this._map.removeOverlay(this);
782-
}
783-
784799
;function DataControl(superObj) {
785800
this.initDom();
786801
this.initEvent();
@@ -1281,15 +1296,26 @@ util.addCssByStyle(
12811296
);
12821297

12831298
function DrawTypeControl(options) {
1299+
Class.call(this);
12841300
options = options || {};
1301+
1302+
this.initOptions($.extend({
1303+
mapv: null,
1304+
drawTypeControlOptions: {},
1305+
layer: null
1306+
}, options));
1307+
1308+
this.bindTo('drawTypeControlOptions', this.getMapv());
1309+
12851310
// console.log('@@@@@@', options)
12861311
this.mapv = options.mapv;
12871312
// 默认停靠位置和偏移量
12881313
this.defaultAnchor = BMAP_ANCHOR_TOP_RIGHT;
12891314
this.defaultOffset = new BMap.Size(10, 10);
12901315
}
12911316

1292-
DrawTypeControl.prototype = new BMap.Control();
1317+
util.inherits(DrawTypeControl, Class);
1318+
util.inherits(DrawTypeControl, BMap.Control);
12931319

12941320
DrawTypeControl.prototype.initialize = function (map) {
12951321
var ul = this.ul = document.createElement('ul');
@@ -1308,11 +1334,13 @@ DrawTypeControl.prototype.initialize = function (map) {
13081334
var drawType = target.getAttribute('drawType');
13091335
target.className = 'current';
13101336

1311-
me._layer.setDrawType(drawType);
1337+
me.layer.setDrawType(drawType);
13121338

13131339
}
13141340
});
13151341

1342+
this.showLayer();
1343+
13161344
// 添加DOM元素到地图中
13171345
map.getContainer().appendChild(ul);
13181346
// 将DOM元素返回
@@ -1324,15 +1352,29 @@ DrawTypeControl.prototype.getContainer = function () {
13241352
return this.ul;
13251353
};
13261354

1327-
DrawTypeControl.prototype.showLayer = function (layer) {
1328-
this._layer = layer;
1355+
DrawTypeControl.prototype.drawTypeControlOptions_changed = function () {
1356+
this.layer = this.getDrawTypeControlOptions().layer;
1357+
1358+
if (!this.layer) {
1359+
return;
1360+
}
1361+
1362+
this.showLayer();
1363+
1364+
}
1365+
1366+
DrawTypeControl.prototype.showLayer = function () {
1367+
if (!this.layer) {
1368+
return;
1369+
}
13291370
// get the drawTypes from options by Mofei
13301371
var ul = this.ul;
13311372
ul.innerHTML = "";
1332-
var drawTypes = layer.getDrawOptions();
1333-
for (var key in drawTypes) {
1373+
var drawTypes = ['simple', 'heatmap', 'density', 'bubble', 'category', 'choropleth', 'intensity', 'cluster'];
1374+
for (var i = 0; i < drawTypes.length; i++) {
1375+
var key = drawTypes[i];
13341376
var li = document.createElement('li');
1335-
if (layer.getDrawType() === key) {
1377+
if (this.layer.getDrawType() === key) {
13361378
li.className = 'current';
13371379
}
13381380
li.setAttribute('drawType', key);
@@ -2733,7 +2775,7 @@ IntensityDrawer.prototype.drawMap = function () {
27332775
ctx.beginPath();
27342776
ctx.moveTo(item.px, item.py);
27352777
ctx.fillStyle = this.getColor(item.count);
2736-
ctx.arc(item.px, item.py, drawOptions.radius, 0, 2 * Math.PI);
2778+
ctx.arc(item.px, item.py, drawOptions.radius || 1, 0, 2 * Math.PI);
27372779
ctx.closePath();
27382780
ctx.fill();
27392781
}

‎dist/Mapv.min.js‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)