bar.js 32 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648
  1. define('echarts/chart/bar', [
  2. 'require',
  3. './base',
  4. 'zrender/shape/Rectangle',
  5. '../component/axis',
  6. '../component/grid',
  7. '../component/dataZoom',
  8. '../config',
  9. '../util/ecData',
  10. 'zrender/tool/util',
  11. 'zrender/tool/color',
  12. '../chart'
  13. ], function (require) {
  14. var ChartBase = require('./base');
  15. var RectangleShape = require('zrender/shape/Rectangle');
  16. require('../component/axis');
  17. require('../component/grid');
  18. require('../component/dataZoom');
  19. var ecConfig = require('../config');
  20. ecConfig.bar = {
  21. zlevel: 0,
  22. z: 2,
  23. clickable: true,
  24. legendHoverLink: true,
  25. xAxisIndex: 0,
  26. yAxisIndex: 0,
  27. barMinHeight: 0,
  28. barGap: '30%',
  29. barCategoryGap: '20%',
  30. itemStyle: {
  31. normal: {
  32. barBorderColor: '#fff',
  33. barBorderRadius: 0,
  34. barBorderWidth: 0,
  35. label: { show: false }
  36. },
  37. emphasis: {
  38. barBorderColor: '#fff',
  39. barBorderRadius: 0,
  40. barBorderWidth: 0,
  41. label: { show: false }
  42. }
  43. }
  44. };
  45. var ecData = require('../util/ecData');
  46. var zrUtil = require('zrender/tool/util');
  47. var zrColor = require('zrender/tool/color');
  48. function Bar(ecTheme, messageCenter, zr, option, myChart) {
  49. ChartBase.call(this, ecTheme, messageCenter, zr, option, myChart);
  50. this.refresh(option);
  51. }
  52. Bar.prototype = {
  53. type: ecConfig.CHART_TYPE_BAR,
  54. _buildShape: function () {
  55. this._buildPosition();
  56. },
  57. _buildNormal: function (seriesArray, maxDataLength, locationMap, xMarkMap, orient) {
  58. var series = this.series;
  59. var seriesIndex = locationMap[0][0];
  60. var serie = series[seriesIndex];
  61. var isHorizontal = orient == 'horizontal';
  62. var xAxis = this.component.xAxis;
  63. var yAxis = this.component.yAxis;
  64. var categoryAxis = isHorizontal ? xAxis.getAxis(serie.xAxisIndex) : yAxis.getAxis(serie.yAxisIndex);
  65. var valueAxis;
  66. var size = this._mapSize(categoryAxis, locationMap);
  67. var gap = size.gap;
  68. var barGap = size.barGap;
  69. var barWidthMap = size.barWidthMap;
  70. var barMaxWidthMap = size.barMaxWidthMap;
  71. var barWidth = size.barWidth;
  72. var barMinHeightMap = size.barMinHeightMap;
  73. var barHeight;
  74. var curBarWidth;
  75. var interval = size.interval;
  76. var x;
  77. var y;
  78. var lastP;
  79. var baseP;
  80. var lastN;
  81. var baseN;
  82. var barShape;
  83. var data;
  84. var value;
  85. var islandR = this.deepQuery([
  86. this.ecTheme,
  87. ecConfig
  88. ], 'island.r');
  89. for (var i = 0, l = maxDataLength; i < l; i++) {
  90. if (categoryAxis.getNameByIndex(i) == null) {
  91. break;
  92. }
  93. isHorizontal ? x = categoryAxis.getCoordByIndex(i) - gap / 2 : y = categoryAxis.getCoordByIndex(i) + gap / 2;
  94. for (var j = 0, k = locationMap.length; j < k; j++) {
  95. var yAxisIndex = series[locationMap[j][0]].yAxisIndex || 0;
  96. var xAxisIndex = series[locationMap[j][0]].xAxisIndex || 0;
  97. valueAxis = isHorizontal ? yAxis.getAxis(yAxisIndex) : xAxis.getAxis(xAxisIndex);
  98. baseP = lastP = baseN = lastN = valueAxis.getCoord(0);
  99. for (var m = 0, n = locationMap[j].length; m < n; m++) {
  100. seriesIndex = locationMap[j][m];
  101. serie = series[seriesIndex];
  102. data = serie.data[i];
  103. value = this.getDataFromOption(data, '-');
  104. xMarkMap[seriesIndex] = xMarkMap[seriesIndex] || {
  105. min: Number.POSITIVE_INFINITY,
  106. max: Number.NEGATIVE_INFINITY,
  107. sum: 0,
  108. counter: 0,
  109. average: 0
  110. };
  111. curBarWidth = Math.min(barMaxWidthMap[seriesIndex] || Number.MAX_VALUE, barWidthMap[seriesIndex] || barWidth);
  112. if (value === '-') {
  113. continue;
  114. }
  115. if (value > 0) {
  116. barHeight = m > 0 ? valueAxis.getCoordSize(value) : isHorizontal ? baseP - valueAxis.getCoord(value) : valueAxis.getCoord(value) - baseP;
  117. if (n === 1 && barMinHeightMap[seriesIndex] > barHeight) {
  118. barHeight = barMinHeightMap[seriesIndex];
  119. }
  120. if (isHorizontal) {
  121. lastP -= barHeight;
  122. y = lastP;
  123. } else {
  124. x = lastP;
  125. lastP += barHeight;
  126. }
  127. } else if (value < 0) {
  128. barHeight = m > 0 ? valueAxis.getCoordSize(value) : isHorizontal ? valueAxis.getCoord(value) - baseN : baseN - valueAxis.getCoord(value);
  129. if (n === 1 && barMinHeightMap[seriesIndex] > barHeight) {
  130. barHeight = barMinHeightMap[seriesIndex];
  131. }
  132. if (isHorizontal) {
  133. y = lastN;
  134. lastN += barHeight;
  135. } else {
  136. lastN -= barHeight;
  137. x = lastN;
  138. }
  139. } else {
  140. barHeight = 0;
  141. if (isHorizontal) {
  142. lastP -= barHeight;
  143. y = lastP;
  144. } else {
  145. x = lastP;
  146. lastP += barHeight;
  147. }
  148. }
  149. xMarkMap[seriesIndex][i] = isHorizontal ? x + curBarWidth / 2 : y - curBarWidth / 2;
  150. if (xMarkMap[seriesIndex].min > value) {
  151. xMarkMap[seriesIndex].min = value;
  152. if (isHorizontal) {
  153. xMarkMap[seriesIndex].minY = y;
  154. xMarkMap[seriesIndex].minX = xMarkMap[seriesIndex][i];
  155. } else {
  156. xMarkMap[seriesIndex].minX = x + barHeight;
  157. xMarkMap[seriesIndex].minY = xMarkMap[seriesIndex][i];
  158. }
  159. }
  160. if (xMarkMap[seriesIndex].max < value) {
  161. xMarkMap[seriesIndex].max = value;
  162. if (isHorizontal) {
  163. xMarkMap[seriesIndex].maxY = y;
  164. xMarkMap[seriesIndex].maxX = xMarkMap[seriesIndex][i];
  165. } else {
  166. xMarkMap[seriesIndex].maxX = x + barHeight;
  167. xMarkMap[seriesIndex].maxY = xMarkMap[seriesIndex][i];
  168. }
  169. }
  170. xMarkMap[seriesIndex].sum += value;
  171. xMarkMap[seriesIndex].counter++;
  172. if (i % interval === 0) {
  173. barShape = this._getBarItem(seriesIndex, i, categoryAxis.getNameByIndex(i), x, y - (isHorizontal ? 0 : curBarWidth), isHorizontal ? curBarWidth : barHeight, isHorizontal ? barHeight : curBarWidth, isHorizontal ? 'vertical' : 'horizontal');
  174. this.shapeList.push(new RectangleShape(barShape));
  175. }
  176. }
  177. for (var m = 0, n = locationMap[j].length; m < n; m++) {
  178. seriesIndex = locationMap[j][m];
  179. serie = series[seriesIndex];
  180. data = serie.data[i];
  181. value = this.getDataFromOption(data, '-');
  182. curBarWidth = Math.min(barMaxWidthMap[seriesIndex] || Number.MAX_VALUE, barWidthMap[seriesIndex] || barWidth);
  183. if (value != '-') {
  184. continue;
  185. }
  186. if (this.deepQuery([
  187. data,
  188. serie,
  189. this.option
  190. ], 'calculable')) {
  191. if (isHorizontal) {
  192. lastP -= islandR;
  193. y = lastP;
  194. } else {
  195. x = lastP;
  196. lastP += islandR;
  197. }
  198. barShape = this._getBarItem(seriesIndex, i, categoryAxis.getNameByIndex(i), x, y - (isHorizontal ? 0 : curBarWidth), isHorizontal ? curBarWidth : islandR, isHorizontal ? islandR : curBarWidth, isHorizontal ? 'vertical' : 'horizontal');
  199. barShape.hoverable = false;
  200. barShape.draggable = false;
  201. barShape.style.lineWidth = 1;
  202. barShape.style.brushType = 'stroke';
  203. barShape.style.strokeColor = serie.calculableHolderColor || this.ecTheme.calculableHolderColor || ecConfig.calculableHolderColor;
  204. this.shapeList.push(new RectangleShape(barShape));
  205. }
  206. }
  207. isHorizontal ? x += curBarWidth + barGap : y -= curBarWidth + barGap;
  208. }
  209. }
  210. this._calculMarkMapXY(xMarkMap, locationMap, isHorizontal ? 'y' : 'x');
  211. },
  212. _buildHorizontal: function (seriesArray, maxDataLength, locationMap, xMarkMap) {
  213. return this._buildNormal(seriesArray, maxDataLength, locationMap, xMarkMap, 'horizontal');
  214. },
  215. _buildVertical: function (seriesArray, maxDataLength, locationMap, xMarkMap) {
  216. return this._buildNormal(seriesArray, maxDataLength, locationMap, xMarkMap, 'vertical');
  217. },
  218. _buildOther: function (seriesArray, maxDataLength, locationMap, xMarkMap) {
  219. var series = this.series;
  220. for (var j = 0, k = locationMap.length; j < k; j++) {
  221. for (var m = 0, n = locationMap[j].length; m < n; m++) {
  222. var seriesIndex = locationMap[j][m];
  223. var serie = series[seriesIndex];
  224. var xAxisIndex = serie.xAxisIndex || 0;
  225. var xAxis = this.component.xAxis.getAxis(xAxisIndex);
  226. var baseX = xAxis.getCoord(0);
  227. var yAxisIndex = serie.yAxisIndex || 0;
  228. var yAxis = this.component.yAxis.getAxis(yAxisIndex);
  229. var baseY = yAxis.getCoord(0);
  230. xMarkMap[seriesIndex] = xMarkMap[seriesIndex] || {
  231. min0: Number.POSITIVE_INFINITY,
  232. min1: Number.POSITIVE_INFINITY,
  233. max0: Number.NEGATIVE_INFINITY,
  234. max1: Number.NEGATIVE_INFINITY,
  235. sum0: 0,
  236. sum1: 0,
  237. counter0: 0,
  238. counter1: 0,
  239. average0: 0,
  240. average1: 0
  241. };
  242. for (var i = 0, l = serie.data.length; i < l; i++) {
  243. var data = serie.data[i];
  244. var value = this.getDataFromOption(data, '-');
  245. if (!(value instanceof Array)) {
  246. continue;
  247. }
  248. var x = xAxis.getCoord(value[0]);
  249. var y = yAxis.getCoord(value[1]);
  250. var queryTarget = [
  251. data,
  252. serie
  253. ];
  254. var barWidth = this.deepQuery(queryTarget, 'barWidth') || 10;
  255. var barHeight = this.deepQuery(queryTarget, 'barHeight');
  256. var orient;
  257. var barShape;
  258. if (barHeight != null) {
  259. orient = 'horizontal';
  260. if (value[0] > 0) {
  261. barWidth = x - baseX;
  262. x -= barWidth;
  263. } else if (value[0] < 0) {
  264. barWidth = baseX - x;
  265. } else {
  266. barWidth = 0;
  267. }
  268. barShape = this._getBarItem(seriesIndex, i, value[0], x, y - barHeight / 2, barWidth, barHeight, orient);
  269. } else {
  270. orient = 'vertical';
  271. if (value[1] > 0) {
  272. barHeight = baseY - y;
  273. } else if (value[1] < 0) {
  274. barHeight = y - baseY;
  275. y -= barHeight;
  276. } else {
  277. barHeight = 0;
  278. }
  279. barShape = this._getBarItem(seriesIndex, i, value[0], x - barWidth / 2, y, barWidth, barHeight, orient);
  280. }
  281. this.shapeList.push(new RectangleShape(barShape));
  282. x = xAxis.getCoord(value[0]);
  283. y = yAxis.getCoord(value[1]);
  284. if (xMarkMap[seriesIndex].min0 > value[0]) {
  285. xMarkMap[seriesIndex].min0 = value[0];
  286. xMarkMap[seriesIndex].minY0 = y;
  287. xMarkMap[seriesIndex].minX0 = x;
  288. }
  289. if (xMarkMap[seriesIndex].max0 < value[0]) {
  290. xMarkMap[seriesIndex].max0 = value[0];
  291. xMarkMap[seriesIndex].maxY0 = y;
  292. xMarkMap[seriesIndex].maxX0 = x;
  293. }
  294. xMarkMap[seriesIndex].sum0 += value[0];
  295. xMarkMap[seriesIndex].counter0++;
  296. if (xMarkMap[seriesIndex].min1 > value[1]) {
  297. xMarkMap[seriesIndex].min1 = value[1];
  298. xMarkMap[seriesIndex].minY1 = y;
  299. xMarkMap[seriesIndex].minX1 = x;
  300. }
  301. if (xMarkMap[seriesIndex].max1 < value[1]) {
  302. xMarkMap[seriesIndex].max1 = value[1];
  303. xMarkMap[seriesIndex].maxY1 = y;
  304. xMarkMap[seriesIndex].maxX1 = x;
  305. }
  306. xMarkMap[seriesIndex].sum1 += value[1];
  307. xMarkMap[seriesIndex].counter1++;
  308. }
  309. }
  310. }
  311. this._calculMarkMapXY(xMarkMap, locationMap, 'xy');
  312. },
  313. _mapSize: function (categoryAxis, locationMap, ignoreUserDefined) {
  314. var res = this._findSpecialBarSzie(locationMap, ignoreUserDefined);
  315. var barWidthMap = res.barWidthMap;
  316. var barMaxWidthMap = res.barMaxWidthMap;
  317. var barMinHeightMap = res.barMinHeightMap;
  318. var sBarWidthCounter = res.sBarWidthCounter;
  319. var sBarWidthTotal = res.sBarWidthTotal;
  320. var barGap = res.barGap;
  321. var barCategoryGap = res.barCategoryGap;
  322. var gap;
  323. var barWidth;
  324. var interval = 1;
  325. if (locationMap.length != sBarWidthCounter) {
  326. if (!ignoreUserDefined) {
  327. gap = typeof barCategoryGap === 'string' && barCategoryGap.match(/%$/) ? (categoryAxis.getGap() * (100 - parseFloat(barCategoryGap)) / 100).toFixed(2) - 0 : categoryAxis.getGap() - barCategoryGap;
  328. if (typeof barGap === 'string' && barGap.match(/%$/)) {
  329. barGap = parseFloat(barGap) / 100;
  330. barWidth = +((gap - sBarWidthTotal) / ((locationMap.length - 1) * barGap + locationMap.length - sBarWidthCounter)).toFixed(2);
  331. barGap = barWidth * barGap;
  332. } else {
  333. barGap = parseFloat(barGap);
  334. barWidth = +((gap - sBarWidthTotal - barGap * (locationMap.length - 1)) / (locationMap.length - sBarWidthCounter)).toFixed(2);
  335. }
  336. if (barWidth <= 0) {
  337. return this._mapSize(categoryAxis, locationMap, true);
  338. }
  339. } else {
  340. gap = categoryAxis.getGap();
  341. barGap = 0;
  342. barWidth = +(gap / locationMap.length).toFixed(2);
  343. if (barWidth <= 0) {
  344. interval = Math.floor(locationMap.length / gap);
  345. barWidth = 1;
  346. }
  347. }
  348. } else {
  349. gap = sBarWidthCounter > 1 ? typeof barCategoryGap === 'string' && barCategoryGap.match(/%$/) ? +(categoryAxis.getGap() * (100 - parseFloat(barCategoryGap)) / 100).toFixed(2) : categoryAxis.getGap() - barCategoryGap : sBarWidthTotal;
  350. barWidth = 0;
  351. barGap = sBarWidthCounter > 1 ? +((gap - sBarWidthTotal) / (sBarWidthCounter - 1)).toFixed(2) : 0;
  352. if (barGap < 0) {
  353. return this._mapSize(categoryAxis, locationMap, true);
  354. }
  355. }
  356. return this._recheckBarMaxWidth(locationMap, barWidthMap, barMaxWidthMap, barMinHeightMap, gap, barWidth, barGap, interval);
  357. },
  358. _findSpecialBarSzie: function (locationMap, ignoreUserDefined) {
  359. var series = this.series;
  360. var barWidthMap = {};
  361. var barMaxWidthMap = {};
  362. var barMinHeightMap = {};
  363. var sBarWidth;
  364. var sBarMaxWidth;
  365. var sBarWidthCounter = 0;
  366. var sBarWidthTotal = 0;
  367. var barGap;
  368. var barCategoryGap;
  369. for (var j = 0, k = locationMap.length; j < k; j++) {
  370. var hasFound = {
  371. barWidth: false,
  372. barMaxWidth: false
  373. };
  374. for (var m = 0, n = locationMap[j].length; m < n; m++) {
  375. var seriesIndex = locationMap[j][m];
  376. var queryTarget = series[seriesIndex];
  377. if (!ignoreUserDefined) {
  378. if (!hasFound.barWidth) {
  379. sBarWidth = this.query(queryTarget, 'barWidth');
  380. if (sBarWidth != null) {
  381. barWidthMap[seriesIndex] = sBarWidth;
  382. sBarWidthTotal += sBarWidth;
  383. sBarWidthCounter++;
  384. hasFound.barWidth = true;
  385. for (var ii = 0, ll = m; ii < ll; ii++) {
  386. var pSeriesIndex = locationMap[j][ii];
  387. barWidthMap[pSeriesIndex] = sBarWidth;
  388. }
  389. }
  390. } else {
  391. barWidthMap[seriesIndex] = sBarWidth;
  392. }
  393. if (!hasFound.barMaxWidth) {
  394. sBarMaxWidth = this.query(queryTarget, 'barMaxWidth');
  395. if (sBarMaxWidth != null) {
  396. barMaxWidthMap[seriesIndex] = sBarMaxWidth;
  397. hasFound.barMaxWidth = true;
  398. for (var ii = 0, ll = m; ii < ll; ii++) {
  399. var pSeriesIndex = locationMap[j][ii];
  400. barMaxWidthMap[pSeriesIndex] = sBarMaxWidth;
  401. }
  402. }
  403. } else {
  404. barMaxWidthMap[seriesIndex] = sBarMaxWidth;
  405. }
  406. }
  407. barMinHeightMap[seriesIndex] = this.query(queryTarget, 'barMinHeight');
  408. barGap = barGap != null ? barGap : this.query(queryTarget, 'barGap');
  409. barCategoryGap = barCategoryGap != null ? barCategoryGap : this.query(queryTarget, 'barCategoryGap');
  410. }
  411. }
  412. return {
  413. barWidthMap: barWidthMap,
  414. barMaxWidthMap: barMaxWidthMap,
  415. barMinHeightMap: barMinHeightMap,
  416. sBarWidth: sBarWidth,
  417. sBarMaxWidth: sBarMaxWidth,
  418. sBarWidthCounter: sBarWidthCounter,
  419. sBarWidthTotal: sBarWidthTotal,
  420. barGap: barGap,
  421. barCategoryGap: barCategoryGap
  422. };
  423. },
  424. _recheckBarMaxWidth: function (locationMap, barWidthMap, barMaxWidthMap, barMinHeightMap, gap, barWidth, barGap, interval) {
  425. for (var j = 0, k = locationMap.length; j < k; j++) {
  426. var seriesIndex = locationMap[j][0];
  427. if (barMaxWidthMap[seriesIndex] && barMaxWidthMap[seriesIndex] < barWidth) {
  428. gap -= barWidth - barMaxWidthMap[seriesIndex];
  429. }
  430. }
  431. return {
  432. barWidthMap: barWidthMap,
  433. barMaxWidthMap: barMaxWidthMap,
  434. barMinHeightMap: barMinHeightMap,
  435. gap: gap,
  436. barWidth: barWidth,
  437. barGap: barGap,
  438. interval: interval
  439. };
  440. },
  441. _getBarItem: function (seriesIndex, dataIndex, name, x, y, width, height, orient) {
  442. var series = this.series;
  443. var barShape;
  444. var serie = series[seriesIndex];
  445. var data = serie.data[dataIndex];
  446. var defaultColor = this._sIndex2ColorMap[seriesIndex];
  447. var queryTarget = [
  448. data,
  449. serie
  450. ];
  451. var normal = this.deepMerge(queryTarget, 'itemStyle.normal');
  452. var emphasis = this.deepMerge(queryTarget, 'itemStyle.emphasis');
  453. var normalBorderWidth = normal.barBorderWidth;
  454. barShape = {
  455. zlevel: this.getZlevelBase(),
  456. z: this.getZBase(),
  457. clickable: this.deepQuery(queryTarget, 'clickable'),
  458. style: {
  459. x: x,
  460. y: y,
  461. width: width,
  462. height: height,
  463. brushType: 'both',
  464. color: this.getItemStyleColor(this.deepQuery(queryTarget, 'itemStyle.normal.color') || defaultColor, seriesIndex, dataIndex, data),
  465. radius: normal.barBorderRadius,
  466. lineWidth: normalBorderWidth,
  467. strokeColor: normal.barBorderColor
  468. },
  469. highlightStyle: {
  470. color: this.getItemStyleColor(this.deepQuery(queryTarget, 'itemStyle.emphasis.color'), seriesIndex, dataIndex, data),
  471. radius: emphasis.barBorderRadius,
  472. lineWidth: emphasis.barBorderWidth,
  473. strokeColor: emphasis.barBorderColor
  474. },
  475. _orient: orient
  476. };
  477. var barShapeStyle = barShape.style;
  478. barShape.highlightStyle.color = barShape.highlightStyle.color || (typeof barShapeStyle.color === 'string' ? zrColor.lift(barShapeStyle.color, -0.3) : barShapeStyle.color);
  479. barShapeStyle.x = Math.floor(barShapeStyle.x);
  480. barShapeStyle.y = Math.floor(barShapeStyle.y);
  481. barShapeStyle.height = Math.ceil(barShapeStyle.height);
  482. barShapeStyle.width = Math.ceil(barShapeStyle.width);
  483. if (normalBorderWidth > 0 && barShapeStyle.height > normalBorderWidth && barShapeStyle.width > normalBorderWidth) {
  484. barShapeStyle.y += normalBorderWidth / 2;
  485. barShapeStyle.height -= normalBorderWidth;
  486. barShapeStyle.x += normalBorderWidth / 2;
  487. barShapeStyle.width -= normalBorderWidth;
  488. } else {
  489. barShapeStyle.brushType = 'fill';
  490. }
  491. barShape.highlightStyle.textColor = barShape.highlightStyle.color;
  492. barShape = this.addLabel(barShape, serie, data, name, orient);
  493. var barShapeStyleList = [
  494. barShapeStyle,
  495. barShape.highlightStyle
  496. ];
  497. for (var i = 0, l = barShapeStyleList.length; i < l; i++) {
  498. var textPosition = barShapeStyleList[i].textPosition;
  499. if (textPosition === 'insideLeft' || textPosition === 'insideRight' || textPosition === 'insideTop' || textPosition === 'insideBottom') {
  500. var gap = 5;
  501. switch (textPosition) {
  502. case 'insideLeft':
  503. barShapeStyleList[i].textX = barShapeStyle.x + gap;
  504. barShapeStyleList[i].textY = barShapeStyle.y + barShapeStyle.height / 2;
  505. barShapeStyleList[i].textAlign = 'left';
  506. barShapeStyleList[i].textBaseline = 'middle';
  507. break;
  508. case 'insideRight':
  509. barShapeStyleList[i].textX = barShapeStyle.x + barShapeStyle.width - gap;
  510. barShapeStyleList[i].textY = barShapeStyle.y + barShapeStyle.height / 2;
  511. barShapeStyleList[i].textAlign = 'right';
  512. barShapeStyleList[i].textBaseline = 'middle';
  513. break;
  514. case 'insideTop':
  515. barShapeStyleList[i].textX = barShapeStyle.x + barShapeStyle.width / 2;
  516. barShapeStyleList[i].textY = barShapeStyle.y + gap / 2;
  517. barShapeStyleList[i].textAlign = 'center';
  518. barShapeStyleList[i].textBaseline = 'top';
  519. break;
  520. case 'insideBottom':
  521. barShapeStyleList[i].textX = barShapeStyle.x + barShapeStyle.width / 2;
  522. barShapeStyleList[i].textY = barShapeStyle.y + barShapeStyle.height - gap / 2;
  523. barShapeStyleList[i].textAlign = 'center';
  524. barShapeStyleList[i].textBaseline = 'bottom';
  525. break;
  526. }
  527. barShapeStyleList[i].textPosition = 'specific';
  528. barShapeStyleList[i].textColor = barShapeStyleList[i].textColor || '#fff';
  529. }
  530. }
  531. if (this.deepQuery([
  532. data,
  533. serie,
  534. this.option
  535. ], 'calculable')) {
  536. this.setCalculable(barShape);
  537. barShape.draggable = true;
  538. }
  539. ecData.pack(barShape, series[seriesIndex], seriesIndex, series[seriesIndex].data[dataIndex], dataIndex, name);
  540. return barShape;
  541. },
  542. getMarkCoord: function (seriesIndex, mpData) {
  543. var serie = this.series[seriesIndex];
  544. var xMarkMap = this.xMarkMap[seriesIndex];
  545. var xAxis = this.component.xAxis.getAxis(serie.xAxisIndex);
  546. var yAxis = this.component.yAxis.getAxis(serie.yAxisIndex);
  547. var dataIndex;
  548. var pos;
  549. if (mpData.type && (mpData.type === 'max' || mpData.type === 'min' || mpData.type === 'average')) {
  550. var valueIndex = mpData.valueIndex != null ? mpData.valueIndex : xMarkMap.maxX0 != null ? '1' : '';
  551. pos = [
  552. xMarkMap[mpData.type + 'X' + valueIndex],
  553. xMarkMap[mpData.type + 'Y' + valueIndex],
  554. xMarkMap[mpData.type + 'Line' + valueIndex],
  555. xMarkMap[mpData.type + valueIndex]
  556. ];
  557. } else if (xMarkMap.isHorizontal) {
  558. dataIndex = typeof mpData.xAxis === 'string' && xAxis.getIndexByName ? xAxis.getIndexByName(mpData.xAxis) : mpData.xAxis || 0;
  559. var x = xMarkMap[dataIndex];
  560. x = x != null ? x : typeof mpData.xAxis != 'string' && xAxis.getCoordByIndex ? xAxis.getCoordByIndex(mpData.xAxis || 0) : xAxis.getCoord(mpData.xAxis || 0);
  561. pos = [
  562. x,
  563. yAxis.getCoord(mpData.yAxis || 0)
  564. ];
  565. } else {
  566. dataIndex = typeof mpData.yAxis === 'string' && yAxis.getIndexByName ? yAxis.getIndexByName(mpData.yAxis) : mpData.yAxis || 0;
  567. var y = xMarkMap[dataIndex];
  568. y = y != null ? y : typeof mpData.yAxis != 'string' && yAxis.getCoordByIndex ? yAxis.getCoordByIndex(mpData.yAxis || 0) : yAxis.getCoord(mpData.yAxis || 0);
  569. pos = [
  570. xAxis.getCoord(mpData.xAxis || 0),
  571. y
  572. ];
  573. }
  574. return pos;
  575. },
  576. refresh: function (newOption) {
  577. if (newOption) {
  578. this.option = newOption;
  579. this.series = newOption.series;
  580. }
  581. this.backupShapeList();
  582. this._buildShape();
  583. },
  584. addDataAnimation: function (params, done) {
  585. var series = this.series;
  586. var aniMap = {};
  587. for (var i = 0, l = params.length; i < l; i++) {
  588. aniMap[params[i][0]] = params[i];
  589. }
  590. var x;
  591. var dx;
  592. var y;
  593. var dy;
  594. var serie;
  595. var seriesIndex;
  596. var dataIndex;
  597. var aniCount = 0;
  598. function animationDone() {
  599. aniCount--;
  600. if (aniCount === 0) {
  601. done && done();
  602. }
  603. }
  604. for (var i = this.shapeList.length - 1; i >= 0; i--) {
  605. seriesIndex = ecData.get(this.shapeList[i], 'seriesIndex');
  606. if (aniMap[seriesIndex] && !aniMap[seriesIndex][3]) {
  607. if (this.shapeList[i].type === 'rectangle') {
  608. dataIndex = ecData.get(this.shapeList[i], 'dataIndex');
  609. serie = series[seriesIndex];
  610. if (aniMap[seriesIndex][2] && dataIndex === serie.data.length - 1) {
  611. this.zr.delShape(this.shapeList[i].id);
  612. continue;
  613. } else if (!aniMap[seriesIndex][2] && dataIndex === 0) {
  614. this.zr.delShape(this.shapeList[i].id);
  615. continue;
  616. }
  617. if (this.shapeList[i]._orient === 'horizontal') {
  618. dy = this.component.yAxis.getAxis(serie.yAxisIndex || 0).getGap();
  619. y = aniMap[seriesIndex][2] ? -dy : dy;
  620. x = 0;
  621. } else {
  622. dx = this.component.xAxis.getAxis(serie.xAxisIndex || 0).getGap();
  623. x = aniMap[seriesIndex][2] ? dx : -dx;
  624. y = 0;
  625. }
  626. this.shapeList[i].position = [
  627. 0,
  628. 0
  629. ];
  630. aniCount++;
  631. this.zr.animate(this.shapeList[i].id, '').when(this.query(this.option, 'animationDurationUpdate'), {
  632. position: [
  633. x,
  634. y
  635. ]
  636. }).done(animationDone).start();
  637. }
  638. }
  639. }
  640. if (!aniCount) {
  641. animationDone();
  642. }
  643. }
  644. };
  645. zrUtil.inherits(Bar, ChartBase);
  646. require('../chart').define('bar', Bar);
  647. return Bar;
  648. });