123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168 |
- var zrUtil = require("zrender/lib/core/util");
- var ChartView = require("../../view/Chart");
- var graphic = require("../../util/graphic");
- var Path = require("zrender/lib/graphic/Path");
- var NORMAL_ITEM_STYLE_PATH = ['itemStyle'];
- var EMPHASIS_ITEM_STYLE_PATH = ['emphasis', 'itemStyle'];
- var BoxplotView = ChartView.extend({
- type: 'boxplot',
- render: function (seriesModel, ecModel, api) {
- var data = seriesModel.getData();
- var group = this.group;
- var oldData = this._data;
-
- if (!this._data) {
- group.removeAll();
- }
- var constDim = seriesModel.get('layout') === 'horizontal' ? 1 : 0;
- data.diff(oldData).add(function (newIdx) {
- if (data.hasValue(newIdx)) {
- var itemLayout = data.getItemLayout(newIdx);
- var symbolEl = createNormalBox(itemLayout, data, newIdx, constDim, true);
- data.setItemGraphicEl(newIdx, symbolEl);
- group.add(symbolEl);
- }
- }).update(function (newIdx, oldIdx) {
- var symbolEl = oldData.getItemGraphicEl(oldIdx);
- if (!data.hasValue(newIdx)) {
- group.remove(symbolEl);
- return;
- }
- var itemLayout = data.getItemLayout(newIdx);
- if (!symbolEl) {
- symbolEl = createNormalBox(itemLayout, data, newIdx, constDim);
- } else {
- updateNormalBoxData(itemLayout, symbolEl, data, newIdx);
- }
- group.add(symbolEl);
- data.setItemGraphicEl(newIdx, symbolEl);
- }).remove(function (oldIdx) {
- var el = oldData.getItemGraphicEl(oldIdx);
- el && group.remove(el);
- }).execute();
- this._data = data;
- },
- remove: function (ecModel) {
- var group = this.group;
- var data = this._data;
- this._data = null;
- data && data.eachItemGraphicEl(function (el) {
- el && group.remove(el);
- });
- },
- dispose: zrUtil.noop
- });
- var BoxPath = Path.extend({
- type: 'boxplotBoxPath',
- shape: {},
- buildPath: function (ctx, shape) {
- var ends = shape.points;
- var i = 0;
- ctx.moveTo(ends[i][0], ends[i][1]);
- i++;
- for (; i < 4; i++) {
- ctx.lineTo(ends[i][0], ends[i][1]);
- }
- ctx.closePath();
- for (; i < ends.length; i++) {
- ctx.moveTo(ends[i][0], ends[i][1]);
- i++;
- ctx.lineTo(ends[i][0], ends[i][1]);
- }
- }
- });
- function createNormalBox(itemLayout, data, dataIndex, constDim, isInit) {
- var ends = itemLayout.ends;
- var el = new BoxPath({
- shape: {
- points: isInit ? transInit(ends, constDim, itemLayout) : ends
- }
- });
- updateNormalBoxData(itemLayout, el, data, dataIndex, isInit);
- return el;
- }
- function updateNormalBoxData(itemLayout, el, data, dataIndex, isInit) {
- var seriesModel = data.hostModel;
- var updateMethod = graphic[isInit ? 'initProps' : 'updateProps'];
- updateMethod(el, {
- shape: {
- points: itemLayout.ends
- }
- }, seriesModel, dataIndex);
- var itemModel = data.getItemModel(dataIndex);
- var normalItemStyleModel = itemModel.getModel(NORMAL_ITEM_STYLE_PATH);
- var borderColor = data.getItemVisual(dataIndex, 'color');
- var itemStyle = normalItemStyleModel.getItemStyle(['borderColor']);
- itemStyle.stroke = borderColor;
- itemStyle.strokeNoScale = true;
- el.useStyle(itemStyle);
- el.z2 = 100;
- var hoverStyle = itemModel.getModel(EMPHASIS_ITEM_STYLE_PATH).getItemStyle();
- graphic.setHoverStyle(el, hoverStyle);
- }
- function transInit(points, dim, itemLayout) {
- return zrUtil.map(points, function (point) {
- point = point.slice();
- point[dim] = itemLayout.initBaseline;
- return point;
- });
- }
- var _default = BoxplotView;
- module.exports = _default;
|