Skip to content

I
incubator-echarts

x649585723 / incubator-echarts
与 Fork 源项目一致

从无法访问的项目Fork

通知 1
Star 0
Fork 0
I
incubator-echarts

体验新版 GitCode，发现更多精彩内容 >>

提交 37088a4e 编写于 作者: P pah100
浏览文件
操作

brush support geo

上级 c609002a
展开全部 隐藏空白更改
内联 并排
Showing with 479 addition and 271 deletion
src/component/axis/ParallelAxisView.js
浏览文件 @ 37088a4e
......@@ -82,8 +82,15 @@ define(function (require) {
});
this._brushController
.mount(axisGroup)
.enableBrush({brushType: 'line', brushStyle: areaSelectStyle})
.mount({container: axisGroup, localCoord: true})
.setPanels([{
panelId: 'pl',
rect: axisGroup.getBoundingRect()
}])
.enableBrush({
brushType: 'line',
brushStyle: areaSelectStyle
})
.updateCovers(coverInfoList);
},
......
src/component/brush/BrushModel.js
浏览文件 @ 37088a4e
......@@ -91,7 +91,7 @@ define(function(require) {
if (__DEV__) {
zrUtil.assert(zrUtil.isArray(brushRanges));
zrUtil.each(brushRanges, function (brushRange) {
zrUtil.assert(brushRange.brushType && brushRange.range, 'Illegal brushRanges');
zrUtil.assert(brushRange.brushType, 'Illegal brushRanges');
});
}
......
src/component/brush/BrushView.js
浏览文件 @ 37088a4e
define(function (require) {
var zrUtil = require('zrender/core/util');
var graphic = require('../../util/graphic');
var BrushController = require('../helper/BrushController');
var echarts = require('../../echarts');
var helper = require('./helper');
return echarts.extendComponentView({
type: 'brush',
init: function (ecModel, api) {
var zr = api.getZr();
/**
* @readOnly
......@@ -30,20 +29,13 @@ define(function (require) {
*/
this.model;
/**
* @private
* @type {module:zrender/container/Group}
*/
var controllerGroup = this._controllerGroup = new graphic.Group();
zr.add(controllerGroup);
/**
* @private
* @type {module:echarts/component/helper/BrushController}
*/
(this._brushController = new BrushController(zr))
(this._brushController = new BrushController(api.getZr()))
.on('brush', zrUtil.bind(this._onBrush, this))
.mount(controllerGroup, false);
.mount();
},
/**
......@@ -51,30 +43,23 @@ define(function (require) {
*/
render: function (brushModel) {
this.model = brushModel;
this._brushController
.enableBrush(brushModel.brushOption)
.updateCovers(brushModel.brushRanges);
return updateController.apply(this, arguments);
},
/**
* @override
*/
updateView: function (brushModel, ecModel, api, payload) {
// Do not update controller when drawing.
payload.$from !== this.model.id && this._brushController
.enableBrush(brushModel.brushOption)
.updateCovers(brushModel.brushRanges);
},
updateView: updateController,
/**
* @override
*/
updateLayout: function (brushModel, ecModel) {
ecModel.eachComponent({mainType: 'geo'}, function (geoModel) {
var coord = geoModel.coordinateSystem;
console.log(coord.getBoundingRect());
});
},
updateLayout: updateController,
/**
* @override
*/
updateVisual: updateController,
/**
* @override
......@@ -89,9 +74,12 @@ define(function (require) {
_onBrush: function (brushRanges, opt) {
var modelId = this.model.id;
helper.setCoordRanges(brushRanges, this.ecModel);
// Action is not dispatched on drag end, because the drag end
// emits the same params with the last drag move event, and
// may have some delay when using touch pad.
// may have some delay when using touch pad, which makes
// animation not smooth (when using debounce).
(!opt.isEnd || opt.removeOnClick) && this.api.dispatchAction({
type: 'brush',
brushId: modelId,
......@@ -102,4 +90,12 @@ define(function (require) {
});
function updateController(brushModel, ecModel, api, payload) {
// Do not update controller when drawing.
(!payload || payload.$from !== brushModel.id) && this._brushController
.setPanels(helper.makePanelOpts(brushModel, ecModel))
.enableBrush(brushModel.brushOption)
.updateCovers(helper.setPanelId(brushModel.brushRanges));
}
});
\ No newline at end of file
src/component/brush/helper.js 0 → 100644
浏览文件 @ 37088a4e
define(function(require) {
var zrUtil = require('zrender/core/util');
var graphic = require('../../util/graphic');
var each = zrUtil.each;
var COORD_NAMES = ['geo', 'grid'];
var PANEL_ID_SPLIT = '---';
var helper = {};
helper.convertCoordRanges = function (ecModel) {
ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
each(brushModel.brushRanges, function (brushRange) {
each(COORD_NAMES, function (coordName) {
var coordIndex = brushRange[coordName + 'Index'];
var coordRange = brushRange[coordName + 'Range'];
if (coordIndex >= 0 && coordRange) {
var coordModel = ecModel.getComponent(coordName, coordIndex);
brushRange.range = coordModel
? coordConvert[brushRange.brushType](
'dataToPoint', coordModel.coordinateSystem, coordRange
)
: [];
}
});
});
});
};
helper.setCoordRanges = function (brushRanges, ecModel) {
each(brushRanges, function (brushRange) {
var panelId = brushRange.panelId;
if (panelId) {
panelId = brushRange.panelId.split(PANEL_ID_SPLIT);
var coordName = panelId[0];
var coordIndex = +panelId[1];
var coordModel = ecModel.getComponent(coordName, coordIndex);
brushRange[coordName + 'Index'] = coordIndex;
brushRange[coordName + 'Range'] = coordConvert[brushRange.brushType](
'pointToData', coordModel.coordinateSystem, brushRange.range
);
}
});
};
helper.setPanelId = function (brushRanges) {
each(brushRanges, function (brushRange) {
each(COORD_NAMES, function (coordName) {
var coordIndex = brushRange[coordName + 'Index'];
if (coordIndex != null) {
brushRange.panelId = coordName + PANEL_ID_SPLIT + coordIndex;
}
});
});
return brushRanges;
};
helper.makePanelOpts = function (brushModel, ecModel) {
var panelOpts = [];
each(COORD_NAMES, function (coordName) {
var coordIndices = brushModel.option[coordName + 'Index'];
if (coordIndices == null) {
return;
}
!zrUtil.isArray(coordIndices) && (coordIndices = [coordIndices]);
zrUtil.each(coordIndices, function (coordIndex) {
var coordModel = ecModel.getComponent(coordName, coordIndex);
if (!coordModel) {
return;
}
var coordSys = coordModel.coordinateSystem;
// FIXME
// geo is getBoundingRect, grid is getRect.
var r = (coordSys.getRect || coordSys.getBoundingRect).call(coordSys);
var points = [
[r.x, r.y],
[r.x, r.y + r.height],
[r.x + r.width, r.y + r.height],
[r.x + r.width, r.y]
];
var coordTransform = graphic.getTransform(coordSys);
points = zrUtil.map(points, function (point) {
return graphic.applyTransform(point, coordTransform);
});
panelOpts.push({
panelId: coordName + PANEL_ID_SPLIT + coordIndex,
points: points
});
});
});
return panelOpts;
};
var coordConvert = {
line: function (to, coordSys, coordRange) {
return [
coordSys[to]([coordRange[0], 0]),
coordSys[to]([coordRange[1], 0])
];
},
rect: function (to, coordSys, coordRange) {
var xminymin = coordSys[to]([coordRange[0][0], coordRange[1][0]]);
var xmaxymax = coordSys[to]([coordRange[0][1], coordRange[1][1]]);
return [[xminymin[0], xmaxymax[0]], [xminymin[1], xmaxymax[1]]];
},
polygon: function (to, coordSys, coordRange) {
return zrUtil.map(coordRange, coordSys[to], coordSys);
}
};
return helper;
});
\ No newline at end of file
src/component/brush/visualEncoding.js
浏览文件 @ 37088a4e
/**
* @file Data range visual coding.
* @file Brush visual coding.
*/
define(function (require) {
......@@ -9,15 +9,24 @@ define(function (require) {
var BoundingRect = require('zrender/core/BoundingRect');
var selector = require('./selector');
var throttle = require('../../util/throttle');
var helper = require('./helper');
var STATE_LIST = ['inBrush', 'outOfBrush'];
var DISPATCH_METHOD = '__ecBrushSelect';
var DISPATCH_FLAG = '__ecInBrushSelectEvent';
var PRIORITY_BRUSH = echarts.PRIORITY.VISUAL.BRUSH;
/**
* Layout for visual, the priority higher than other layout, and before brush visual.
*/
echarts.registerLayout(PRIORITY_BRUSH, function (ecModel, api, payload) {
helper.convertCoordRanges(ecModel);
});
/**
* Register the visual encoding if this modules required.
*/
echarts.registerVisual(echarts.PRIORITY.VISUAL.BRUSH, function (ecModel, api, payload) {
echarts.registerVisual(PRIORITY_BRUSH, function (ecModel, api, payload) {
var brushSelected = [];
var throttleType;
......@@ -48,7 +57,7 @@ define(function (require) {
// Add boundingRect and selectors to range.
var brushRanges = zrUtil.map(brushModel.brushRanges, function (brushRange) {
return bindSelector(
zrUtil.extend(
zrUtil.defaults(
{boundingRect: boundingRectBuilders[brushRange.brushType](brushRange)},
brushRange
)
......
src/component/toolbox/feature/DataZoom.js
浏览文件 @ 37088a4e
......@@ -5,7 +5,6 @@ define(function(require) {
var numberUtil = require('../../../util/number');
var BrushController = require('../../helper/BrushController');
var BoundingRect = require('zrender/core/BoundingRect');
var Group = require('zrender/container/Group');
var history = require('../../dataZoom/history');
var each = zrUtil.each;
......@@ -22,22 +21,14 @@ define(function(require) {
this.model = model;
this.ecModel = ecModel;
this.api = api;
var zr = api.getZr();
/**
* @private
* @type {module:zrender/container/Group}
*/
var controllerGroup = this._controllerGroup = new Group();
zr.add(controllerGroup);
/**
* @private
* @type {module:echarts/component/helper/BrushController}
*/
(this._brushController = new BrushController(zr))
(this._brushController = new BrushController(api.getZr()))
.on('brush', zrUtil.bind(this._onBrush, this))
.mount(controllerGroup, false);
.mount();
/**
* Is zoom active.
......@@ -75,9 +66,7 @@ define(function(require) {
};
proto.dispose = function (ecModel, api) {
var zr = api.getZr();
this._brushController.dispose();
this._controllerGroup && zr.remove(this._controllerGroup);
};
/**
......
test/brush.html
浏览文件 @ 37088a4e
......@@ -87,7 +87,7 @@
<div class="split">Scatter</div>
<div class="block">
<div id="main2" class="main"></div>
<!-- <div id="main2" class="main"></div> -->
<div id="main2-st"></div>
<div class="panel">
<ul class="panel-desc">
......@@ -115,8 +115,8 @@
</div>
<div>
DIFF with previous selected:
<input onclick="smChange.diff(true)" type="radio" name="diff" checked="checked"/>Y
<input onclick="smChange.diff(false)" type="radio" name="diff" />N
<input onclick="smChange.diff(true)" type="radio" name="diff"/>Y
<input onclick="smChange.diff(false)" type="radio" name="diff" checked="checked"/>N
</div>
<div>
animation:
......@@ -144,7 +144,7 @@
<div class="split">Stacked Bar (rect-polygon intersect)</div>
<div class="block">
<div id="main4" class="main"></div>
<!-- <div id="main4" class="main"></div> -->
<div class="panel">
<ul class="panel-desc">
<li><strong>CHECK</strong>: rect-polygon intersect.</li>
......@@ -510,7 +510,7 @@
var smSettings = {
seperatedEChartsInstance: false,
diff: true,
diff: false,
animation: true,
animationDurationUpdate: 1000,
throttleDelay: 300,
......@@ -575,15 +575,6 @@
}
}
},
legend: {
orient: 'vertical',
top: 'bottom',
left: 'right',
data:['pm2.5'],
textStyle: {
color: '#fff'
}
},
brush: {
outOfBrush: {
color: '#abc'
......@@ -591,10 +582,19 @@
seriesIndex: [0, 1],
throttleType: smSettings.throttleType,
throttleDelay: smSettings.throttleDelay,
geoIndex: 0,
brushRanges: [
// {
// geoIndex: 0,
// brushType: 'polygon',
// range: [[482,130],[481,130],[470,123],[406,100],[387,94],[377,88],[374,83],[373,81],[366,76],[360,74],[355,73],[346,79],[337,83],[323,84],[301,84],[297,84],[281,88],[265,92],[265,93],[258,120],[265,144],[272,148],[297,168],[319,192],[324,200],[324,201],[325,205],[337,229],[342,240],[343,242],[343,243],[344,247],[345,250],[350,261],[354,268],[355,274],[355,281],[347,300],[342,319],[336,352],[333,388],[336,424],[351,442],[364,451],[375,455],[392,466],[401,474],[409,483],[419,493],[432,502],[453,502],[487,484],[521,436],[536,364],[539,322],[539,309],[537,305],[537,304],[536,295],[517,273],[511,264],[511,264]]
// }
{
geoIndex: 0,
brushType: 'polygon',
range: [[482,130],[481,130],[470,123],[406,100],[387,94],[377,88],[374,83],[373,81],[366,76],[360,74],[355,73],[346,79],[337,83],[323,84],[301,84],[297,84],[281,88],[265,92],[265,93],[258,120],[265,144],[272,148],[297,168],[319,192],[324,200],[324,201],[325,205],[337,229],[342,240],[343,242],[343,243],[344,247],[345,250],[350,261],[354,268],[355,274],[355,281],[347,300],[342,319],[336,352],[333,388],[336,424],[351,442],[364,451],[375,455],[392,466],[401,474],[409,483],[419,493],[432,502],[453,502],[487,484],[521,436],[536,364],[539,322],[539,309],[537,305],[537,304],[536,295],[517,273],[511,264],[511,264]]
// geoRange: [[121.15,31.89], [120.95,31.39], [112.91,27.87], [118.78,32.04]]
// geoRange: [[121.15, 31.89], [121.15, 31.89], [109.781327, 39.608266], [120.38, 37.35], [122.207216, 29.985295], [123.97, 47.33]]
geoRange: [[117.27,31.86], [114.31,30.52], [126.57,43.87]]
}
]
},
......@@ -736,7 +736,8 @@
option.grid.width = '30%';
}
var oldSelectedItems = [];
var oldCategoryData = [];
var oldBarData = [];
chart.on('brushSelected', renderBrushed);
chart.setOption(option, true);
......@@ -758,8 +759,6 @@
var brushComponent = params.brushComponents[0];
var selectedItems = [];
var isDiff;
for (var sIdx = 0; sIdx < brushComponent.series.length; sIdx++) {
var rawIndices = brushComponent.series[sIdx].rawIndices;
var placesBySeries = [];
......@@ -781,18 +780,6 @@
brushed.push('[Series ' + sIdx + '] ' + placesBySeries.join(', '));
}
if (selectedItems.length !== oldSelectedItems.length) {
isDiff = true;
}
else {
for (var i = 0; i < selectedItems.length; i++) {
if (selectedItems[i].value !== oldSelectedItems[i].value
|| selectedItems[i].name !== oldSelectedItems[i].name
) {
isDiff = true;
}
}
}
panel.innerHTML = [
'<h3>STATISTICS:</h3>',
......@@ -817,6 +804,11 @@
barData.push(selectedItems[i].value[2]);
}
var isDiff = checkDiff(categoryData, oldCategoryData)
|| checkDiff(barData, oldBarData);
oldCategoryData = categoryData;
oldBarData = barData;
if (!smSettings.diff || isDiff) {
var targetName = smSettings.seperatedEChartsInstance ? 'chart2' : 'mainChart';
smSettings.diff
......@@ -830,8 +822,21 @@
}
if (smSettings.diff && !isDiff) {
console.log('check diff and NO DIFF');
// if (smSettings.diff && !isDiff) {
// console.log('check diff and NO DIFF');
// }
}
function checkDiff(list, oldList) {
if (list.length !== oldList.length) {
return true;
}
else {
for (var i = 0; i < list.length; i++) {
if (list[i] !== oldList[i]) {
return true;
}
}
}
}
}
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或