1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720 |
- /**
- * echarts图表类:地图
- *
- * @desc echarts基于Canvas,纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据统计图表。
- * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
- *
- */
- define(function (require) {
- var ChartBase = require('./base');
- // 图形依赖
- var TextShape = require('zrender/shape/Text');
- var PathShape = require('zrender/shape/Path');
- var CircleShape = require('zrender/shape/Circle');
- var RectangleShape = require('zrender/shape/Rectangle');
- var LineShape = require('zrender/shape/Line');
- var PolygonShape = require('zrender/shape/Polygon');
- var EllipseShape = require('zrender/shape/Ellipse');
- var ZrImage = require('zrender/shape/Image');
- // 组件依赖
- require('../component/dataRange');
- require('../component/roamController');
- var HeatmapLayer = require('../layer/heatmap');
- var ecConfig = require('../config');
- // 地图默认参数
- ecConfig.map = {
- zlevel: 0, // 一级层叠
- z: 2, // 二级层叠
- mapType: 'china', // 各省的mapType暂时都用中文
- //mapLocation: {
- // x: 'center' | 'left' | 'right' | 'x%' | {number},
- // y: 'center' | 'top' | 'bottom' | 'x%' | {number}
- // width // 自适应
- // height // 自适应
- //},
- // mapValueCalculation: 'sum', // 数值合并方式,默认加和,可选为:
- // 'sum' | 'average' | 'max' | 'min'
- // mapValuePrecision: 0, // 地图数值计算结果小数精度
- showLegendSymbol: true, // 显示图例颜色标识(系列标识的小圆点),存在legend时生效
- // selectedMode: false, // 选择模式,默认关闭,可选single,multiple
- dataRangeHoverLink: true,
- hoverable: true,
- clickable: true,
- // roam: false, // 是否开启缩放及漫游模式
- // scaleLimit: null,
- itemStyle: {
- normal: {
- // color: 各异,
- borderColor: 'rgba(0,0,0,0)',
- borderWidth: 1,
- areaStyle: {
- color: '#ccc'
- },
- label: {
- show: false,
- textStyle: {
- color: 'rgb(139,69,19)'
- }
- }
- },
- emphasis: { // 也是选中样式
- // color: 各异,
- borderColor: 'rgba(0,0,0,0)',
- borderWidth: 1,
- areaStyle: {
- color: 'rgba(255,215,0,0.8)'
- },
- label: {
- show: false,
- textStyle: {
- color: 'rgb(100,0,0)'
- }
- }
- }
- }
- };
- var ecData = require('../util/ecData');
- var zrUtil = require('zrender/tool/util');
- var zrConfig = require('zrender/config');
- var zrEvent = require('zrender/tool/event');
- var _mapParams = require('../util/mapData/params').params;
- var _textFixed = require('../util/mapData/textFixed');
- var _geoCoord = require('../util/mapData/geoCoord');
- /**
- * 构造函数
- * @param {Object} messageCenter echart消息中心
- * @param {ZRender} zr zrender实例
- * @param {Object} series 数据
- * @param {Object} component 组件
- */
- function Map(ecTheme, messageCenter, zr, option, myChart){
- // 图表基类
- ChartBase.call(this, ecTheme, messageCenter, zr, option, myChart);
- var self = this;
- self._onmousewheel = function(params) {
- return self.__onmousewheel(params);
- };
- self._onmousedown = function(params) {
- return self.__onmousedown(params);
- };
- self._onmousemove = function(params) {
- return self.__onmousemove(params);
- };
- self._onmouseup = function(params) {
- return self.__onmouseup(params);
- };
- self._onroamcontroller = function(params) {
- return self.__onroamcontroller(params);
- };
- self._ondrhoverlink = function(params) {
- return self.__ondrhoverlink(params);
- };
- this._isAlive = true; // 活着标记
- this._selectedMode = {}; // 选择模式
- this._activeMapType = {}; // 当前活跃的地图类型
- this._clickable = {}; // 悬浮高亮模式,索引到图表
- this._hoverable = {}; // 悬浮高亮模式,索引到图表
- this._showLegendSymbol = {}; // 显示图例颜色标识
- this._selected = {}; // 地图选择状态
- this._mapTypeMap = {}; // 图例类型索引
- this._mapDataMap = {}; // 根据地图类型索引bbox,transform,path
- this._nameMap = {}; // 个性化地名
- this._specialArea = {}; // 特殊
- this._refreshDelayTicket; // 滚轮缩放时让refresh飞一会
- this._mapDataRequireCounter; // 异步回调计数器
- this._markAnimation = false;
- this._hoverLinkMap = {};
- // 漫游相关信息
- this._roamMap = {};
- this._scaleLimitMap = {};
- this._mx;
- this._my;
- this._mousedown;
- this._justMove; // 避免移动响应点击
- this._curMapType; // 当前移动的地图类型
- this.refresh(option);
- this.zr.on(zrConfig.EVENT.MOUSEWHEEL, this._onmousewheel);
- this.zr.on(zrConfig.EVENT.MOUSEDOWN, this._onmousedown);
- messageCenter.bind(ecConfig.EVENT.ROAMCONTROLLER, this._onroamcontroller);
- messageCenter.bind(ecConfig.EVENT.DATA_RANGE_HOVERLINK, this._ondrhoverlink);
- }
- Map.prototype = {
- type : ecConfig.CHART_TYPE_MAP,
- /**
- * 绘制图形
- */
- _buildShape : function () {
- var series = this.series;
- this.selectedMap = {}; // 系列
- this._activeMapType = {}; // 当前活跃的地图类型
- var legend = this.component.legend;
- var seriesName;
- var valueData = {};
- var mapType;
- var data;
- var name;
- var mapSeries = {};
- var mapValuePrecision = {};
- var valueCalculation = {};
- for (var i = 0, l = series.length; i < l; i++) {
- if (series[i].type == ecConfig.CHART_TYPE_MAP) { // map
- series[i] = this.reformOption(series[i]);
- mapType = series[i].mapType;
- mapSeries[mapType] = mapSeries[mapType] || {};
- mapSeries[mapType][i] = true;
- mapValuePrecision[mapType] = mapValuePrecision[mapType]
- || series[i].mapValuePrecision;
- this._scaleLimitMap[mapType] = this._scaleLimitMap[mapType] || {};
- series[i].scaleLimit
- && zrUtil.merge(this._scaleLimitMap[mapType], series[i].scaleLimit, true);
- this._roamMap[mapType] = series[i].roam || this._roamMap[mapType];
- if (this._hoverLinkMap[mapType] == null || this._hoverLinkMap[mapType]) {
- // false 1票否决
- this._hoverLinkMap[mapType] = series[i].dataRangeHoverLink;
- }
- this._nameMap[mapType] = this._nameMap[mapType] || {};
- series[i].nameMap
- && zrUtil.merge(this._nameMap[mapType], series[i].nameMap, true);
- this._activeMapType[mapType] = true;
- if (series[i].textFixed) {
- zrUtil.merge(
- _textFixed, series[i].textFixed, true
- );
- }
- if (series[i].geoCoord) {
- zrUtil.merge(
- _geoCoord, series[i].geoCoord, true
- );
- }
- this._selectedMode[mapType] = this._selectedMode[mapType]
- || series[i].selectedMode;
- if (this._hoverable[mapType] == null || this._hoverable[mapType]) {
- // false 1票否决
- this._hoverable[mapType] = series[i].hoverable;
- }
- if (this._clickable[mapType] == null || this._clickable[mapType]) {
- // false 1票否决
- this._clickable[mapType] = series[i].clickable;
- }
- if (this._showLegendSymbol[mapType] == null
- || this._showLegendSymbol[mapType]
- ) {
- // false 1票否决
- this._showLegendSymbol[mapType] = series[i].showLegendSymbol;
- }
- valueCalculation[mapType] = valueCalculation[mapType]
- || series[i].mapValueCalculation;
- seriesName = series[i].name;
- this.selectedMap[seriesName] = legend
- ? legend.isSelected(seriesName)
- : true;
- if (this.selectedMap[seriesName]) {
- valueData[mapType] = valueData[mapType] || {};
- data = series[i].data;
- for (var j = 0, k = data.length; j < k; j++) {
- name = this._nameChange(mapType, data[j].name);
- valueData[mapType][name] = valueData[mapType][name]
- || {
- seriesIndex : [],
- valueMap: {},
- precision: 0
- };
- for (var key in data[j]) {
- if (key != 'value') {
- valueData[mapType][name][key] =
- data[j][key];
- }
- else if (!isNaN(data[j].value)) {
- // value
- valueData[mapType][name].value == null
- && (valueData[mapType][name].value = 0);
- valueData[mapType][name].precision =
- Math.max(
- this.getPrecision(+data[j].value),
- valueData[mapType][name].precision
- );
- valueData[mapType][name].value += (+data[j].value);
- valueData[mapType][name].valueMap[i] = +data[j].value;
- }
- }
- //索引有该区域的系列样式
- valueData[mapType][name].seriesIndex.push(i);
- }
- }
- }
- }
- this._mapDataRequireCounter = 0;
- for (var mt in valueData) {
- this._mapDataRequireCounter++;
- }
- //清空
- this._clearSelected();
- if (this._mapDataRequireCounter === 0) {
- this.clear();
- this.zr && this.zr.delShape(this.lastShapeList);
- this.lastShapeList = [];
- }
- for (var mt in valueData) {
- for (var k in valueData[mt]) {
- if (valueCalculation[mt] == 'average') {
- valueData[mt][k].value /= valueData[mt][k].seriesIndex.length;
- }
- var value = valueData[mt][k].value;
- if (value != null) {
- valueData[mt][k].value = value.toFixed(
- mapValuePrecision[mt] == null
- ? valueData[mt][k].precision : mapValuePrecision[mt]
- ) - 0;
- }
- }
- this._mapDataMap[mt] = this._mapDataMap[mt] || {};
- if (this._mapDataMap[mt].mapData) {
- // 已经缓存了则直接用
- this._mapDataCallback(mt, valueData[mt], mapSeries[mt])(
- this._mapDataMap[mt].mapData
- );
- }
- else if (_mapParams[mt.replace(/\|.*/, '')].getGeoJson) {
- // 特殊区域
- this._specialArea[mt] =
- _mapParams[mt.replace(/\|.*/, '')].specialArea
- || this._specialArea[mt];
- _mapParams[mt.replace(/\|.*/, '')].getGeoJson(
- this._mapDataCallback(mt, valueData[mt], mapSeries[mt])
- );
- }
- }
- },
- /**
- * @param {string} mt mapType
- * @parma {Object} vd valueData
- * @param {Object} ms mapSeries
- */
- _mapDataCallback : function (mt, vd, ms) {
- var self = this;
- return function (md) {
- if (!self._isAlive || self._activeMapType[mt] == null) {
- // 异步地图数据回调时有可能实例已经被释放
- return;
- }
- // 缓存这份数据
- if (mt.indexOf('|') != -1) {
- // 子地图,加工一份新的mapData
- md = self._getSubMapData(mt, md);
- }
- self._mapDataMap[mt].mapData = md;
- if (md.firstChild) {
- self._mapDataMap[mt].rate = 1;
- self._mapDataMap[mt].projection = require('../util/projection/svg');
- }
- else {
- self._mapDataMap[mt].rate = 0.75;
- self._mapDataMap[mt].projection = require('../util/projection/normal');
- }
- self._buildMap(
- mt, // 类型
- self._getProjectionData(mt, md, ms), // 地图数据
- vd, // 用户数据
- ms // 系列
- );
- self._buildMark(mt, ms);
- if (--self._mapDataRequireCounter <= 0) {
- self.addShapeList();
- self.zr.refreshNextFrame();
- }
- self._buildHeatmap(mt);
- };
- },
- _clearSelected : function() {
- for (var k in this._selected) {
- if (!this._activeMapType[this._mapTypeMap[k]]) {
- delete this._selected[k];
- delete this._mapTypeMap[k];
- }
- }
- },
- _getSubMapData : function (mapType, mapData) {
- var subType = mapType.replace(/^.*\|/, '');
- var features = mapData.features;
- for (var i = 0, l = features.length; i < l; i++) {
- if (features[i].properties
- && features[i].properties.name == subType
- ) {
- features = features[i];
- if (subType == 'United States of America'
- && features.geometry.coordinates.length > 1 // 未被简化
- ) {
- features = {
- geometry: {
- coordinates: features.geometry
- .coordinates.slice(5,6),
- type: features.geometry.type
- },
- id: features.id,
- properties: features.properties,
- type: features.type
- };
- }
- break;
- }
- }
- return {
- 'type' : 'FeatureCollection',
- 'features':[
- features
- ]
- };
- },
- /**
- * 按需加载相关地图
- */
- _getProjectionData : function (mapType, mapData, mapSeries) {
- var normalProjection = this._mapDataMap[mapType].projection;
- var province = [];
- // bbox永远不变
- var bbox = this._mapDataMap[mapType].bbox
- || normalProjection.getBbox(
- mapData, this._specialArea[mapType]
- );
- //console.log(bbox)
- var transform;
- //console.log(1111,transform)
- if (!this._mapDataMap[mapType].hasRoam) {
- // 第一次或者发生了resize,需要判断
- transform = this._getTransform(
- bbox,
- mapSeries,
- this._mapDataMap[mapType].rate
- );
- }
- else {
- //经过用户漫游不再响应resize
- transform = this._mapDataMap[mapType].transform;
- }
- //console.log(bbox,transform)
- var lastTransform = this._mapDataMap[mapType].lastTransform
- || {scale:{}};
- var pathArray;
- if (transform.left != lastTransform.left
- || transform.top != lastTransform.top
- || transform.scale.x != lastTransform.scale.x
- || transform.scale.y != lastTransform.scale.y
- ) {
- // 发生过变化,需要重新生成pathArray
- // 一般投射
- //console.log(transform)
- pathArray = normalProjection.geoJson2Path(
- mapData, transform, this._specialArea[mapType]
- );
- lastTransform = zrUtil.clone(transform);
- }
- else {
- transform = this._mapDataMap[mapType].transform;
- pathArray = this._mapDataMap[mapType].pathArray;
- }
- this._mapDataMap[mapType].bbox = bbox;
- this._mapDataMap[mapType].transform = transform;
- this._mapDataMap[mapType].lastTransform = lastTransform;
- this._mapDataMap[mapType].pathArray = pathArray;
- //console.log(pathArray)
- var position = [transform.left, transform.top];
- for (var i = 0, l = pathArray.length; i < l; i++) {
- /* for test
- console.log(
- mapData.features[i].properties.cp, // 经纬度度
- pathArray[i].cp // 平面坐标
- );
- console.log(
- this.pos2geo(mapType, pathArray[i].cp), // 平面坐标转经纬度
- this.geo2pos(mapType, mapData.features[i].properties.cp)
- )
- */
- province.push(this._getSingleProvince(
- mapType, pathArray[i], position
- ));
- }
- if (this._specialArea[mapType]) {
- for (var area in this._specialArea[mapType]) {
- province.push(this._getSpecialProjectionData(
- mapType, mapData,
- area, this._specialArea[mapType][area],
- position
- ));
- }
- }
- // 中国地图加入南海诸岛
- if (mapType == 'china') {
- var leftTop = this.geo2pos(
- mapType,
- _geoCoord['南海诸岛'] || _mapParams['南海诸岛'].textCoord
- );
- // scale.x : width = 10.51 : 64
- var scale = transform.scale.x / 10.5;
- var textPosition = [
- 32 * scale + leftTop[0],
- 83 * scale + leftTop[1]
- ];
- if (_textFixed['南海诸岛']) {
- textPosition[0] += _textFixed['南海诸岛'][0];
- textPosition[1] += _textFixed['南海诸岛'][1];
- }
- province.push({
- name : this._nameChange(mapType, '南海诸岛'),
- path : _mapParams['南海诸岛'].getPath(leftTop, scale),
- position : position,
- textX : textPosition[0],
- textY : textPosition[1]
- });
- }
- //console.log(JSON.stringify(province));
- //console.log(JSON.stringify(this._mapDataMap[mapType].transform));
- return province;
- },
- /**
- * 特殊地区投射数据
- */
- _getSpecialProjectionData : function (mapType, mapData, areaName, mapSize, position) {
- //console.log('_getSpecialProjectionData--------------')
- // 构造单独的geoJson地图数据
- mapData = this._getSubMapData('x|' + areaName, mapData);
- // bbox
- var normalProjection = require('../util/projection/normal');
- var bbox = normalProjection.getBbox(mapData);
- //console.log('bbox', bbox)
- // transform
- var leftTop = this.geo2pos(
- mapType,
- [mapSize.left, mapSize.top]
- );
- var rightBottom = this.geo2pos(
- mapType,
- [mapSize.left + mapSize.width, mapSize.top + mapSize.height]
- );
- //console.log('leftright' , leftTop, rightBottom);
- var width = Math.abs(rightBottom[0] - leftTop[0]);
- var height = Math.abs(rightBottom[1] - leftTop[1]);
- var mapWidth = bbox.width;
- var mapHeight = bbox.height;
- //var minScale;
- var xScale = (width / 0.75) / mapWidth;
- var yScale = height / mapHeight;
- if (xScale > yScale) {
- xScale = yScale * 0.75;
- width = mapWidth * xScale;
- }
- else {
- yScale = xScale;
- xScale = yScale * 0.75;
- height = mapHeight * yScale;
- }
- var transform = {
- OffsetLeft : leftTop[0],
- OffsetTop : leftTop[1],
- //width: width,
- //height: height,
- scale : {
- x : xScale,
- y : yScale
- }
- };
- //console.log('**',areaName, transform)
- var pathArray = normalProjection.geoJson2Path(
- mapData, transform
- );
- //console.log(pathArray)
- return this._getSingleProvince(
- mapType, pathArray[0], position
- );
- },
- _getSingleProvince : function (mapType, path, position) {
- var textPosition;
- var name = path.properties.name;
- var textFixed = _textFixed[name] || [0, 0];
- if (_geoCoord[name]) {
- // 经纬度直接定位不加textFixed
- textPosition = this.geo2pos(
- mapType,
- _geoCoord[name]
- );
- }
- else if (path.cp) {
- textPosition = [
- path.cp[0] + textFixed[0],
- path.cp[1] + textFixed[1]
- ];
- }
- else {
- var bbox = this._mapDataMap[mapType].bbox;
- textPosition = this.geo2pos(
- mapType,
- [bbox.left + bbox.width / 2, bbox.top + bbox.height / 2]
- );
- textPosition[0] += textFixed[0];
- textPosition[1] += textFixed[1];
- }
- //console.log(textPosition)
- path.name = this._nameChange(mapType, name);
- path.position = position;
- path.textX = textPosition[0];
- path.textY = textPosition[1];
- return path;
- },
- /**
- * 获取缩放
- */
- _getTransform : function (bbox, mapSeries, rate) {
- var series = this.series;
- var mapLocation;
- var x;
- var cusX;
- var y;
- var cusY;
- var width;
- var height;
- var zrWidth = this.zr.getWidth();
- var zrHeight = this.zr.getHeight();
- //上下左右留空
- var padding = Math.round(Math.min(zrWidth, zrHeight) * 0.02);
- for (var key in mapSeries) {
- mapLocation = series[key].mapLocation || {};
- cusX = mapLocation.x || cusX;
- cusY = mapLocation.y || cusY;
- width = mapLocation.width || width;
- height = mapLocation.height || height;
- }
- //x = isNaN(cusX) ? padding : cusX;
- x = this.parsePercent(cusX, zrWidth);
- x = isNaN(x) ? padding : x;
- //y = isNaN(cusY) ? padding : cusY;
- y = this.parsePercent(cusY, zrHeight);
- y = isNaN(y) ? padding : y;
- width = width == null
- ? (zrWidth - x - 2 * padding)
- : (this.parsePercent(width, zrWidth));
- height = height == null
- ? (zrHeight - y - 2 * padding)
- : (this.parsePercent(height, zrHeight));
- var mapWidth = bbox.width;
- var mapHeight = bbox.height;
- //var minScale;
- var xScale = (width / rate) / mapWidth;
- var yScale = height / mapHeight;
- if (xScale > yScale) {
- //minScale = yScale;
- xScale = yScale * rate;
- width = mapWidth * xScale;
- }
- else {
- //minScale = xScale;
- yScale = xScale;
- xScale = yScale * rate;
- height = mapHeight * yScale;
- }
- //console.log(minScale)
- //width = mapWidth * minScale;
- //height = mapHeight * minScale;
- if (isNaN(cusX)) {
- cusX = cusX || 'center';
- switch (cusX + '') {
- case 'center' :
- x = Math.floor((zrWidth - width) / 2);
- break;
- case 'right' :
- x = zrWidth - width;
- break;
- //case 'left' :
- //x = padding;
- }
- }
- //console.log(cusX,x,zrWidth,width,'kener')
- if (isNaN(cusY)) {
- cusY = cusY || 'center';
- switch (cusY + '') {
- case 'center' :
- y = Math.floor((zrHeight - height) / 2);
- break;
- case 'bottom' :
- y = zrHeight - height;
- break;
- //case 'top' :
- //y = padding;
- }
- }
- //console.log(x,y,width,height)
- return {
- left : x,
- top : y,
- width: width,
- height: height,
- //scale : minScale * 50, // wtf 50
- baseScale : 1,
- scale : {
- x : xScale,
- y : yScale
- }
- //translate : [x + width / 2, y + height / 2]
- };
- },
- /**
- * 构建地图
- * @param {Object} mapData 图形数据
- * @param {Object} valueData 用户数据
- */
- _buildMap : function (mapType, mapData, valueData, mapSeries) {
- var series = this.series;
- var legend = this.component.legend;
- var dataRange = this.component.dataRange;
- var seriesName;
- var name;
- var data;
- var value;
- var queryTarget;
- var color;
- var font;
- var style;
- var highlightStyle;
- var shape;
- var textShape;
- for (var i = 0, l = mapData.length; i < l; i++) {
- style = zrUtil.clone(mapData[i]);
- highlightStyle = {
- name : style.name,
- path : style.path,
- position : zrUtil.clone(style.position)
- };
- name = style.name;
- data = valueData[name]; // 多系列合并后的数据
- if (data) {
- queryTarget = [data]; // level 3
- seriesName = '';
- for (var j = 0, k = data.seriesIndex.length; j < k; j++) {
- var serie = series[data.seriesIndex[j]];
- // level 2
- queryTarget.push(serie);
- seriesName += serie.name + ' ';
- if (legend
- && this._showLegendSymbol[mapType]
- && legend.hasColor(serie.name)
- ) {
- this.shapeList.push(new CircleShape({
- zlevel : serie.zlevel,
- z : serie.z + 1,
- position : zrUtil.clone(style.position),
- _mapType : mapType,
- /*
- _geo : this.pos2geo(
- mapType, [style.textX + 3 + j * 7, style.textY - 10]
- ),
- */
- style : {
- x : style.textX + 3 + j * 7,
- y : style.textY - 10,
- r : 3,
- color : legend.getColor(
- serie.name
- )
- },
- hoverable : false
- }));
- }
- }
- value = data.value;
- }
- else {
- data = {
- name: name,
- value: '-'
- };
- seriesName = '';
- queryTarget = [];
- for (var key in mapSeries) {
- queryTarget.push(series[key]);
- }
- value = '-';
- }
- this.ecTheme.map && queryTarget.push(this.ecTheme.map); // level 1
- queryTarget.push(ecConfig.map); // level 1
- // 值域控件控制
- color = (dataRange && !isNaN(value))
- ? dataRange.getColor(value)
- : null;
- // 常规设置
- style.color = style.color
- || color
- || this.getItemStyleColor(
- this.deepQuery(queryTarget, 'itemStyle.normal.color'),
- data.seriesIndex, -1, data
- )
- || this.deepQuery(
- queryTarget, 'itemStyle.normal.areaStyle.color'
- );
- style.strokeColor = style.strokeColor
- || this.deepQuery(queryTarget, 'itemStyle.normal.borderColor');
- style.lineWidth = style.lineWidth
- || this.deepQuery(queryTarget, 'itemStyle.normal.borderWidth');
- // 高亮
- highlightStyle.color = this.getItemStyleColor(
- this.deepQuery(queryTarget, 'itemStyle.emphasis.color'),
- data.seriesIndex, -1, data
- )
- || this.deepQuery(
- queryTarget, 'itemStyle.emphasis.areaStyle.color'
- )
- || style.color;
- highlightStyle.strokeColor = this.deepQuery(
- queryTarget, 'itemStyle.emphasis.borderColor'
- )
- || style.strokeColor;
- highlightStyle.lineWidth = this.deepQuery(
- queryTarget, 'itemStyle.emphasis.borderWidth'
- )
- || style.lineWidth;
- style.brushType = highlightStyle.brushType = style.brushType || 'both';
- style.lineJoin = highlightStyle.lineJoin = 'round';
- style._name = highlightStyle._name = name;
- font = this.deepQuery(queryTarget, 'itemStyle.normal.label.textStyle');
- // 文字标签避免覆盖单独一个shape
- textShape = {
- zlevel : this.getZlevelBase(),
- z : this.getZBase() + 1,
- //hoverable: this._hoverable[mapType],
- //clickable: this._clickable[mapType],
- position : zrUtil.clone(style.position),
- _mapType : mapType,
- _geo : this.pos2geo(
- mapType, [style.textX, style.textY]
- ),
- style : {
- brushType : 'fill',
- x : style.textX,
- y : style.textY,
- text : this.getLabelText(name, value, queryTarget, 'normal'),
- _name : name,
- textAlign : 'center',
- color : this.deepQuery(queryTarget, 'itemStyle.normal.label.show')
- ? this.deepQuery(
- queryTarget,
- 'itemStyle.normal.label.textStyle.color'
- )
- : 'rgba(0,0,0,0)',
- textFont : this.getFont(font)
- }
- };
- textShape._style = zrUtil.clone(textShape.style);
- textShape.highlightStyle = zrUtil.clone(textShape.style);
- if (this.deepQuery(queryTarget, 'itemStyle.emphasis.label.show')) {
- textShape.highlightStyle.text = this.getLabelText(
- name, value, queryTarget, 'emphasis'
- );
- textShape.highlightStyle.color = this.deepQuery(
- queryTarget,
- 'itemStyle.emphasis.label.textStyle.color'
- ) || textShape.style.color;
- font = this.deepQuery(
- queryTarget,
- 'itemStyle.emphasis.label.textStyle'
- ) || font;
- textShape.highlightStyle.textFont = this.getFont(font);
- }
- else {
- textShape.highlightStyle.color = 'rgba(0,0,0,0)';
- }
- shape = {
- zlevel : this.getZlevelBase(),
- z : this.getZBase(),
- //hoverable: this._hoverable[mapType],
- //clickable: this._clickable[mapType],
- position : zrUtil.clone(style.position),
- style : style,
- highlightStyle : highlightStyle,
- _style: zrUtil.clone(style),
- _mapType: mapType
- };
- if (style.scale != null) {
- shape.scale = zrUtil.clone(style.scale);
- }
- textShape = new TextShape(textShape);
- switch (shape.style.shapeType) {
- case 'rectangle' :
- shape = new RectangleShape(shape);
- break;
- case 'line' :
- shape = new LineShape(shape);
- break;
- case 'circle' :
- shape = new CircleShape(shape);
- break;
- case 'polygon' :
- shape = new PolygonShape(shape);
- break;
- case 'ellipse':
- shape = new EllipseShape(shape);
- break;
- default :
- shape = new PathShape(shape);
- if (shape.buildPathArray) {
- shape.style.pathArray = shape.buildPathArray(shape.style.path);
- }
- break;
- }
- if (this._selectedMode[mapType] &&
- (this._selected[name] && data.selected !== false)
- || data.selected === true
- ) {
- textShape.style = textShape.highlightStyle;
- shape.style = shape.highlightStyle;
- }
- textShape.clickable = shape.clickable =
- this._clickable[mapType]
- && (data.clickable == null || data.clickable);
- if (this._selectedMode[mapType]) {
- this._selected[name] = this._selected[name] != null
- ? this._selected[name]
- : data.selected;
- this._mapTypeMap[name] = mapType;
- if (data.selectable == null || data.selectable) {
- shape.clickable = textShape.clickable = true;
- shape.onclick = textShape.onclick = this.shapeHandler.onclick;
- }
- }
- if (this._hoverable[mapType]
- && (data.hoverable == null || data.hoverable)
- ) {
- textShape.hoverable = shape.hoverable = true;
- shape.hoverConnect = textShape.id;
- textShape.hoverConnect = shape.id;
- }
- else {
- textShape.hoverable = shape.hoverable = false;
- }
- // console.log(name,shape);
- ecData.pack(
- textShape,
- {
- name: seriesName,
- tooltip: this.deepQuery(queryTarget, 'tooltip')
- },
- 0,
- data, 0,
- name
- );
- this.shapeList.push(textShape);
- ecData.pack(
- shape,
- {
- name: seriesName,
- tooltip: this.deepQuery(queryTarget, 'tooltip')
- },
- 0,
- data, 0,
- name
- );
- this.shapeList.push(shape);
- }
- //console.log(this._selected);
- },
- // 添加标注
- _buildMark : function (mapType, mapSeries) {
- this._seriesIndexToMapType = this._seriesIndexToMapType || {};
- this.markAttachStyle = this.markAttachStyle || {};
- var position = [
- this._mapDataMap[mapType].transform.left,
- this._mapDataMap[mapType].transform.top
- ];
- if (mapType == 'none') {
- position = [0, 0];
- }
- for (var sIdx in mapSeries) {
- this._seriesIndexToMapType[sIdx] = mapType;
- this.markAttachStyle[sIdx] = {
- position : position,
- _mapType : mapType
- };
- this.buildMark(sIdx);
- }
- },
- _buildHeatmap: function(mapType) {
- var series = this.series;
- for (var i = 0, l = series.length; i < l; i++) {
- // render heatmap
- if (series[i].heatmap) {
- // convert geo position to screen position
- var data = series[i].heatmap.data;
- if (series[i].heatmap.needsTransform === false) {
- // baidu map position, does not need transform
- var geo = [];
- for (var j = 0, len = data.length; j < len; ++j) {
- geo.push([data[j][3], data[j][4], data[j][2]]);
- }
- var pos = [0, 0]
- } else {
- // other map
- var geoData = series[i].heatmap._geoData;
- // copy initial geo position
- if (geoData === undefined) {
- series[i].heatmap._geoData = [];
- for (var j = 0, len = data.length; j < len; ++j) {
- series[i].heatmap._geoData[j] = data[j];
- }
- geoData = series[i].heatmap._geoData;
- }
- var len = data.length;
- for (var id = 0; id < len; ++id) {
- data[id] = this.geo2pos(mapType,
- [geoData[id][0], geoData[id][1]]);
- }
- var pos = [
- this._mapDataMap[mapType].transform.left,
- this._mapDataMap[mapType].transform.top
- ]
- }
- var layer = new HeatmapLayer(series[i].heatmap);
- var canvas = layer.getCanvas(data[0][3] ? geo : data,
- this.zr.getWidth(), this.zr.getHeight())
- var image = new ZrImage({
- zlevel: this.getZlevelBase(),
- z: this.getZBase() + 1,
- position: pos,
- scale: [1, 1],
- hoverable: false,
- style: {
- x: 0,
- y: 0,
- image: canvas,
- width: canvas.width,
- height: canvas.height
- }
- });
- image.type = 'heatmap';
- image._mapType = mapType;
- this.shapeList.push(image);
- this.zr.addShape(image);
- }
- }
- },
- // 位置转换
- getMarkCoord : function (seriesIndex, mpData) {
- return (mpData.geoCoord || _geoCoord[mpData.name])
- ? this.geo2pos(
- this._seriesIndexToMapType[seriesIndex],
- mpData.geoCoord || _geoCoord[mpData.name]
- )
- : [0, 0];
- },
- getMarkGeo : function(mpData) {
- return mpData.geoCoord || _geoCoord[mpData.name];
- },
- _nameChange : function (mapType, name) {
- return this._nameMap[mapType][name] || name;
- },
- /**
- * 根据lable.format计算label text
- */
- getLabelText : function (name, value, queryTarget, status) {
- var formatter = this.deepQuery(
- queryTarget,
- 'itemStyle.' + status + '.label.formatter'
- );
- if (formatter) {
- if (typeof formatter == 'function') {
- return formatter.call(
- this.myChart,
- name,
- value
- );
- }
- else if (typeof formatter == 'string') {
- formatter = formatter.replace('{a}','{a0}')
- .replace('{b}','{b0}');
- formatter = formatter.replace('{a0}', name)
- .replace('{b0}', value);
- return formatter;
- }
- }
- else {
- return name;
- }
- },
- _findMapTypeByPos : function (mx, my) {
- var transform;
- var left;
- var top;
- var width;
- var height;
- for (var mapType in this._mapDataMap) {
- transform = this._mapDataMap[mapType].transform;
- if (!transform || !this._roamMap[mapType] || !this._activeMapType[mapType]) {
- continue;
- }
- left = transform.left;
- top = transform.top;
- width = transform.width;
- height = transform.height;
- if (mx >= left
- && mx <= (left + width)
- && my >= top
- && my <= (top + height)
- ) {
- return mapType;
- }
- }
- return;
- },
- /**
- * 滚轮缩放
- */
- __onmousewheel : function (params) {
- if (this.shapeList.length <= 0) {
- return;
- }
- for (var i = 0, l = this.shapeList.length; i < l; i++) {
- var shape = this.shapeList[i];
- // If any shape is still animating
- if (shape.__animating) {
- return;
- }
- }
- var event = params.event;
- var mx = zrEvent.getX(event);
- var my = zrEvent.getY(event);
- var delta;
- var eventDelta = zrEvent.getDelta(event);
- //eventDelta = eventDelta > 0 ? (-1) : 1;
- var mapType;
- var mapTypeControl = params.mapTypeControl;
- if (!mapTypeControl) {
- mapTypeControl = {};
- mapType = this._findMapTypeByPos(mx, my);
- if (mapType && this._roamMap[mapType] && this._roamMap[mapType] != 'move') {
- mapTypeControl[mapType] = true;
- }
- }
- function scalePolyline(shapeStyle, delta) {
- for (var i = 0; i < shapeStyle.pointList.length; i++) {
- var point = shapeStyle.pointList[i];
- point[0] *= delta;
- point[1] *= delta;
- }
- //If smoothness > 0
- var controlPointList = shapeStyle.controlPointList;
- if (controlPointList) {
- for (var i = 0; i < controlPointList.length; i++) {
- var point = controlPointList[i];
- point[0] *= delta;
- point[1] *= delta;
- }
- }
- }
- function scaleMarkline(shapeStyle, delta) {
- shapeStyle.xStart *= delta;
- shapeStyle.yStart *= delta;
- shapeStyle.xEnd *= delta;
- shapeStyle.yEnd *= delta;
- if (shapeStyle.cpX1 != null) {
- shapeStyle.cpX1 *= delta;
- shapeStyle.cpY1 *= delta;
- }
- }
- var haveScale = false;
- for (mapType in mapTypeControl) {
- if (mapTypeControl[mapType]) {
- haveScale = true;
- var transform = this._mapDataMap[mapType].transform;
- var left = transform.left;
- var top = transform.top;
- var width = transform.width;
- var height = transform.height;
- // 位置转经纬度
- var geoAndPos = this.pos2geo(mapType, [mx - left, my - top]);
- if (eventDelta > 0) {
- delta = 1.2; // 放大
- if (this._scaleLimitMap[mapType].max != null
- && transform.baseScale >= this._scaleLimitMap[mapType].max
- ) {
- continue; // 缩放限制
- }
- }
- else {
- delta = 1 / 1.2; // 缩小
- if (this._scaleLimitMap[mapType].min != null
- && transform.baseScale <= this._scaleLimitMap[mapType].min
- ) {
- continue; // 缩放限制
- }
- }
- transform.baseScale *= delta;
- transform.scale.x *= delta;
- transform.scale.y *= delta;
- transform.width = width * delta;
- transform.height = height * delta;
- this._mapDataMap[mapType].hasRoam = true;
- this._mapDataMap[mapType].transform = transform;
- // 经纬度转位置
- geoAndPos = this.geo2pos(mapType, geoAndPos);
- // 保持视觉中心
- transform.left -= geoAndPos[0] - (mx - left);
- transform.top -= geoAndPos[1] - (my - top);
- this._mapDataMap[mapType].transform = transform;
- this.clearEffectShape(true);
- for (var i = 0, l = this.shapeList.length; i < l; i++) {
- var shape = this.shapeList[i];
- if(shape._mapType == mapType) {
- var shapeType = shape.type;
- var shapeStyle = shape.style;
- shape.position[0] = transform.left;
- shape.position[1] = transform.top;
- switch (shapeType) {
- case 'path':
- case 'symbol':
- case 'circle':
- case 'rectangle':
- case 'polygon':
- case 'line':
- case 'ellipse':
- case 'heatmap':
- shape.scale[0] *= delta;
- shape.scale[1] *= delta;
- break;
- case 'mark-line':
- scaleMarkline(shapeStyle, delta);
- break;
- case 'polyline':
- scalePolyline(shapeStyle, delta);
- break;
- case 'shape-bundle':
- for (var j = 0; j < shapeStyle.shapeList.length; j++) {
- var subShape = shapeStyle.shapeList[j];
- if (subShape.type == 'mark-line') {
- scaleMarkline(subShape.style, delta);
- }
- else if (subShape.type == 'polyline') {
- scalePolyline(subShape.style, delta);
- }
- }
- break;
- case 'icon':
- case 'image':
- geoAndPos = this.geo2pos(mapType, shape._geo);
- shapeStyle.x = shapeStyle._x =
- geoAndPos[0] - shapeStyle.width / 2;
- shapeStyle.y = shapeStyle._y =
- geoAndPos[1] - shapeStyle.height / 2;
- break;
- default:
- geoAndPos = this.geo2pos(mapType, shape._geo);
- shapeStyle.x = geoAndPos[0];
- shapeStyle.y = geoAndPos[1];
- if (shapeType == 'text') {
- shape._style.x = shape.highlightStyle.x
- = geoAndPos[0];
- shape._style.y = shape.highlightStyle.y
- = geoAndPos[1];
- }
- }
- this.zr.modShape(shape.id);
- }
- }
- }
- }
- if (haveScale) {
- zrEvent.stop(event);
- this.zr.refreshNextFrame();
- var self = this;
- clearTimeout(this._refreshDelayTicket);
- this._refreshDelayTicket = setTimeout(
- function(){
- self && self.shapeList && self.animationEffect();
- },
- 100
- );
- this.messageCenter.dispatch(
- ecConfig.EVENT.MAP_ROAM,
- params.event,
- {type : 'scale'},
- this.myChart
- );
- }
- },
- __onmousedown : function (params) {
- if (this.shapeList.length <= 0) {
- return;
- }
- var target = params.target;
- if (target && target.draggable) {
- return;
- }
- var event = params.event;
- var mx = zrEvent.getX(event);
- var my = zrEvent.getY(event);
- var mapType = this._findMapTypeByPos(mx, my);
- if (mapType && this._roamMap[mapType] && this._roamMap[mapType] != 'scale') {
- this._mousedown = true;
- this._mx = mx;
- this._my = my;
- this._curMapType = mapType;
- this.zr.on(zrConfig.EVENT.MOUSEUP, this._onmouseup);
- var self = this;
- setTimeout(function (){
- self.zr.on(zrConfig.EVENT.MOUSEMOVE, self._onmousemove);
- },100);
- }
- },
- __onmousemove : function (params) {
- if (!this._mousedown || !this._isAlive) {
- return;
- }
- var event = params.event;
- var mx = zrEvent.getX(event);
- var my = zrEvent.getY(event);
- var transform = this._mapDataMap[this._curMapType].transform;
- transform.hasRoam = true;
- transform.left -= this._mx - mx;
- transform.top -= this._my - my;
- this._mx = mx;
- this._my = my;
- this._mapDataMap[this._curMapType].transform = transform;
- for (var i = 0, l = this.shapeList.length; i < l; i++) {
- if(this.shapeList[i]._mapType == this._curMapType) {
- this.shapeList[i].position[0] = transform.left;
- this.shapeList[i].position[1] = transform.top;
- this.zr.modShape(this.shapeList[i].id);
- }
- }
- this.messageCenter.dispatch(
- ecConfig.EVENT.MAP_ROAM,
- params.event,
- {type : 'move'},
- this.myChart
- );
- this.clearEffectShape(true);
- this.zr.refreshNextFrame();
- this._justMove = true;
- zrEvent.stop(event);
- },
- __onmouseup : function (params) {
- var event = params.event;
- this._mx = zrEvent.getX(event);
- this._my = zrEvent.getY(event);
- this._mousedown = false;
- var self = this;
- setTimeout(function (){
- self._justMove && self.animationEffect();
- self._justMove = false;
- self.zr.un(zrConfig.EVENT.MOUSEMOVE, self._onmousemove);
- self.zr.un(zrConfig.EVENT.MOUSEUP, self._onmouseup);
- },120);
- },
- /**
- * 漫游组件事件响应
- */
- __onroamcontroller: function(params) {
- var event = params.event;
- event.zrenderX = this.zr.getWidth() / 2;
- event.zrenderY = this.zr.getHeight() / 2;
- var mapTypeControl = params.mapTypeControl;
- var top = 0;
- var left = 0;
- var step = params.step;
- switch(params.roamType) {
- case 'scaleUp':
- event.zrenderDelta = 1;
- this.__onmousewheel({
- event: event,
- mapTypeControl: mapTypeControl
- });
- return;
- case 'scaleDown':
- event.zrenderDelta = -1;
- this.__onmousewheel({
- event: event,
- mapTypeControl: mapTypeControl
- });
- return;
- case 'up':
- top = -step;
- break;
- case 'down':
- top = step;
- break;
- case 'left':
- left = -step;
- break;
- case 'right':
- left = step;
- break;
- }
- var transform;
- var curMapType;
- for (curMapType in mapTypeControl) {
- if (!this._mapDataMap[curMapType] || !this._activeMapType[curMapType]) {
- continue;
- }
- transform = this._mapDataMap[curMapType].transform;
- transform.hasRoam = true;
- transform.left -= left;
- transform.top -= top;
- this._mapDataMap[curMapType].transform = transform;
- }
- for (var i = 0, l = this.shapeList.length; i < l; i++) {
- curMapType = this.shapeList[i]._mapType;
- if (!mapTypeControl[curMapType] || !this._activeMapType[curMapType]) {
- continue;
- }
- transform = this._mapDataMap[curMapType].transform;
- this.shapeList[i].position[0] = transform.left;
- this.shapeList[i].position[1] = transform.top;
- this.zr.modShape(this.shapeList[i].id);
- }
- this.messageCenter.dispatch(
- ecConfig.EVENT.MAP_ROAM,
- params.event,
- {type : 'move'},
- this.myChart
- );
- this.clearEffectShape(true);
- this.zr.refreshNextFrame();
- clearTimeout(this.dircetionTimer);
- var self = this;
- this.dircetionTimer = setTimeout(function() {
- self.animationEffect();
- }, 150);
- },
- /**
- * dataRange hoverlink 事件响应
- */
- __ondrhoverlink : function(param) {
- var curMapType;
- var value;
- for (var i = 0, l = this.shapeList.length; i < l; i++) {
- curMapType = this.shapeList[i]._mapType;
- if (!this._hoverLinkMap[curMapType] || !this._activeMapType[curMapType]) {
- continue;
- }
- value = ecData.get(this.shapeList[i], 'value');
- if (value != null && value >= param.valueMin && value <= param.valueMax) {
- this.zr.addHoverShape(this.shapeList[i]);
- }
- }
- },
- /**
- * 点击响应
- */
- onclick : function (params) {
- if (!this.isClick || !params.target || this._justMove || params.target.type == 'icon') {
- // 没有在当前实例上发生点击直接返回
- return;
- }
- this.isClick = false;
- var target = params.target;
- var name = target.style._name;
- var len = this.shapeList.length;
- var mapType = target._mapType || '';
- if (this._selectedMode[mapType] == 'single') {
- for (var p in this._selected) {
- // 同一地图类型
- if (this._selected[p] && this._mapTypeMap[p] == mapType) {
- // 复位那些生效shape(包括文字)
- for (var i = 0; i < len; i++) {
- if (this.shapeList[i].style._name == p
- && this.shapeList[i]._mapType == mapType
- ) {
- this.shapeList[i].style = this.shapeList[i]._style;
- this.zr.modShape(this.shapeList[i].id);
- }
- }
- p != name && (this._selected[p] = false);
- }
- }
- }
- this._selected[name] = !this._selected[name];
- // 更新当前点击shape(包括文字)
- for (var i = 0; i < len; i++) {
- if (this.shapeList[i].style._name == name
- && this.shapeList[i]._mapType == mapType
- ) {
- if (this._selected[name]) {
- this.shapeList[i].style = this.shapeList[i].highlightStyle;
- }
- else {
- this.shapeList[i].style = this.shapeList[i]._style;
- }
- this.zr.modShape(this.shapeList[i].id);
- }
- }
- this.messageCenter.dispatch(
- ecConfig.EVENT.MAP_SELECTED,
- params.event,
- {
- selected : this._selected,
- target : name
- },
- this.myChart
- );
- this.zr.refreshNextFrame();
- var self = this;
- setTimeout(function(){
- self.zr.trigger(
- zrConfig.EVENT.MOUSEMOVE,
- params.event
- );
- },100);
- },
- /**
- * 刷新
- */
- refresh : function (newOption) {
- if (newOption) {
- this.option = newOption;
- this.series = newOption.series;
- }
- if (this._mapDataRequireCounter > 0) {
- this.clear();
- }
- else {
- this.backupShapeList();
- }
- this._buildShape();
- this.zr.refreshHover();
- },
- /**
- * 值域响应
- * @param {Object} param
- * @param {Object} status
- */
- ondataRange : function (param, status) {
- if (this.component.dataRange) {
- this.refresh();
- status.needRefresh = true;
- }
- return;
- },
- /**
- * 平面坐标转经纬度
- */
- pos2geo : function (mapType, p) {
- if (!this._mapDataMap[mapType].transform) {
- return null;
- }
- return this._mapDataMap[mapType].projection.pos2geo(
- this._mapDataMap[mapType].transform, p
- );
- },
- /**
- * 公开接口 : 平面坐标转经纬度
- */
- getGeoByPos : function (mapType, p) {
- if (!this._mapDataMap[mapType].transform) {
- return null;
- }
- var position = [
- this._mapDataMap[mapType].transform.left,
- this._mapDataMap[mapType].transform.top
- ];
- if (p instanceof Array) {
- p[0] -= position[0];
- p[1] -= position[1];
- }
- else {
- p.x -= position[0];
- p.y -= position[1];
- }
- return this.pos2geo(mapType, p);
- },
- /**
- * 经纬度转平面坐标
- * @param {Object} p
- */
- geo2pos : function (mapType, p) {
- if (!this._mapDataMap[mapType].transform) {
- return null;
- }
- return this._mapDataMap[mapType].projection.geo2pos(
- this._mapDataMap[mapType].transform, p
- );
- },
- /**
- * 公开接口 : 经纬度转平面坐标
- */
- getPosByGeo : function (mapType, p) {
- if (!this._mapDataMap[mapType].transform) {
- return null;
- }
- var pos = this.geo2pos(mapType, p);
- pos[0] += this._mapDataMap[mapType].transform.left;
- pos[1] += this._mapDataMap[mapType].transform.top;
- return pos;
- },
- /**
- * 公开接口 : 地图参考坐标
- */
- getMapPosition : function (mapType) {
- if (!this._mapDataMap[mapType].transform) {
- return null;
- }
- return [
- this._mapDataMap[mapType].transform.left,
- this._mapDataMap[mapType].transform.top
- ];
- },
- /*
- appendShape : function (mapType, shapeList) {
- shapeList = shapeList instanceof Array
- ? shapeList : [shapeList];
- for (var i = 0, l = shapeList.length; i < l; i++) {
- if (typeof shapeList[i].zlevel == 'undefined') {
- shapeList[i].zlevel = this.getZlevelBase();
- shapeList[i].z = this.getZBase() + 1;
- }
- shapeList[i]._mapType = mapType;
- this.shapeList.push(shapeList[i]);
- this.zr.addShape(shapeList[i]);
- }
- this.zr.refresh();
- },
- */
- /**
- * 释放后实例不可用
- */
- onbeforDispose : function () {
- this._isAlive = false;
- this.zr.un(zrConfig.EVENT.MOUSEWHEEL, this._onmousewheel);
- this.zr.un(zrConfig.EVENT.MOUSEDOWN, this._onmousedown);
- this.messageCenter.unbind(
- ecConfig.EVENT.ROAMCONTROLLER, this._onroamcontroller
- );
- this.messageCenter.unbind(
- ecConfig.EVENT.DATA_RANGE_HOVERLINK, this._ondrhoverlink
- );
- }
- };
- zrUtil.inherits(Map, ChartBase);
- // 图表注册
- require('../chart').define('map', Map);
- return Map;
- });
|