Skip to content

I
incubator-echarts

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

从无法访问的项目Fork

通知 1
Star 0
Fork 0
I
incubator-echarts

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

提交 fb1ec727 编写于 作者: K kener
浏览文件
操作

pie selectedMode~~ 

pie selectedMode~~
tooltip bug fixed~
上级 e3676110
隐藏空白更改
内联 并排
Showing with 116 addition and 27 deletion
doc/example/pie3.html
浏览文件 @ fb1ec727
......@@ -85,13 +85,14 @@ option = {
refresh : true
}
},
calculable : true,
calculable : false,
series : [
{
name:'访问来源',
type:'pie',
selectedMode: 'single',
radius : [0, 70],
itemStyle :　{
itemStyle : {
normal : {
label : {
position : 'inner'
......@@ -104,7 +105,7 @@ option = {
data:[
{value:335, name:'直达'},
{value:679, name:'营销广告'},
{value:1548, name:'搜索引擎'}
{value:1548, name:'搜索引擎', selected:true}
]
},
{
......@@ -124,6 +125,22 @@ option = {
}
]
};
var ecConfig = require('echarts/config');
myChart.on(ecConfig.EVENT.PIE_SELECTED, function(param){
var selected = param.selected;
var serie;
var str = '当前选择： ';
for (var idx in selected) {
serie = option.series[idx];
for (var i = 0, l = serie.data.length; i < l; i++) {
if (selected[idx][i]) {
str += '【系列' + idx + '】' + serie.name + ' : ' +
'【数据' + i + '】' + serie.data[i].name + ' ';
}
}
}
document.getElementById('wrong-message').innerHTML = str;
})
</textarea>
</div><!--/.well -->
</div><!--/span-->
......
src/chart/pie.js
浏览文件 @ fb1ec727
......@@ -34,14 +34,21 @@ define(function(require) {
var series; // 共享数据源，不要修改跟自己无关的项
var _zlevelBase = self.getZlevelBase();
var _selectedMode;
var _selected = {};
function _buildShape() {
self.selectedMap = {};
_selected = {};
var pieCase; // 饼图箱子
_selectedMode = false;
for (var i = 0, l = series.length; i < l; i++) {
if (series[i].type == ecConfig.CHART_TYPE_PIE) {
series[i] = self.reformOption(series[i]);
_selectedMode = _selectedMode || series[i].selectedMode;
_selected[i] = [];
if (self.deepQuery([series[i], option], 'calculable')) {
pieCase = {
shape : series[i].radius[0] <= 10
......@@ -128,7 +135,7 @@ define(function(require) {
percent = (percent * 100).toFixed(2);
_buildItem(
seriesIndex, i, percent,
seriesIndex, i, percent, data[i].selected,
startAngle, endAngle, defaultColor
);
startAngle = endAngle;
......@@ -139,12 +146,12 @@ define(function(require) {
* 构建单个扇形及指标
*/
function _buildItem(
seriesIndex, dataIndex, percent,
seriesIndex, dataIndex, percent, isSelected,
startAngle, endAngle, defaultColor
) {
// 扇形
var sector = _getSector(
seriesIndex, dataIndex, percent,
seriesIndex, dataIndex, percent, isSelected,
startAngle, endAngle, defaultColor
);
// 图形需要附加的私有数据
......@@ -184,7 +191,7 @@ define(function(require) {
* 构建扇形
*/
function _getSector(
seriesIndex, dataIndex, percent,
seriesIndex, dataIndex, percent, isSelected,
startAngle, endAngle, defaultColor
) {
var serie = series[seriesIndex];
......@@ -218,10 +225,32 @@ define(function(require) {
},
highlightStyle : {
color : emphasisColor || normalColor || defaultColor
},
clickable : true,
onclick : self.shapeHandler.onclick
}
};
if (isSelected) {
var midAngle =
((sector.style.startAngle + sector.style.endAngle) / 2)
.toFixed(2) - 0;
sector.style._hasSelected = true;
sector.style._x = sector.style.x;
sector.style._y = sector.style.y;
var offset = self.deepQuery([serie], 'selectedOffset');
sector.style.x += zrMath.cos(midAngle, true) * offset;
sector.style.y -= zrMath.sin(midAngle, true) * offset;
_selected[seriesIndex][dataIndex] = true;
}
else {
_selected[seriesIndex][dataIndex] = false;
}
if (_selectedMode) {
sector.clickable = true;
sector.onclick = self.shapeHandler.onclick;
}
if (self.deepQuery([data, serie, option], 'calculable')) {
self.setCalculable(sector);
sector.draggable = true;
......@@ -652,27 +681,65 @@ define(function(require) {
// 没有在当前实例上发生点击直接返回
return;
}
var deviation = 10; // 偏移
var offset; // 偏移
var target = param.target;
var style = target.style;
var seriesIndex = ecData.get(target, 'seriesIndex');
var dataIndex = ecData.get(target, 'dataIndex');
if (!style._hasClick) {
var midAngle = ((style.startAngle + style.endAngle) / 2)
.toFixed(2) - 0;
target.style._hasClick = true;
target.style._x = target.style.x;
target.style._y = target.style.y;
target.style.x += zrMath.cos(midAngle, true) * deviation;
target.style.y -= zrMath.sin(midAngle, true) * deviation;
}
else {
// 复位
target.style.x = target.style._x;
target.style.y = target.style._y;
target.style._hasClick = false;
for (var i = 0, len = self.shapeList.length; i < len; i++) {
if (self.shapeList[i].id == target.id) {
seriesIndex = ecData.get(target, 'seriesIndex');
dataIndex = ecData.get(target, 'dataIndex');
// 当前点击的
if (!style._hasSelected) {
var midAngle =
((style.startAngle + style.endAngle) / 2)
.toFixed(2) - 0;
target.style._hasSelected = true;
_selected[seriesIndex][dataIndex] = true;
target.style._x = target.style.x;
target.style._y = target.style.y;
offset = self.deepQuery(
[series[seriesIndex]],
'selectedOffset'
);
target.style.x += zrMath.cos(midAngle, true)
* offset;
target.style.y -= zrMath.sin(midAngle, true)
* offset;
}
else {
// 复位
target.style.x = target.style._x;
target.style.y = target.style._y;
target.style._hasSelected = false;
_selected[seriesIndex][dataIndex] = false;
}
zr.modShape(target.id, target);
}
else if (self.shapeList[i].style._hasSelected
&& _selectedMode == 'single'
) {
seriesIndex = ecData.get(self.shapeList[i], 'seriesIndex');
dataIndex = ecData.get(self.shapeList[i], 'dataIndex');
// 单选模式下需要取消其他已经选中的
self.shapeList[i].style.x = self.shapeList[i].style._x;
self.shapeList[i].style.y = self.shapeList[i].style._y;
self.shapeList[i].style._hasSelected = false;
_selected[seriesIndex][dataIndex] = false;
zr.modShape(
self.shapeList[i].id, self.shapeList[i]
);
}
}
zr.modShape(target.id, target);
messageCenter.dispatch(
ecConfig.EVENT.PIE_SELECTED,
param.event,
{selected : _selected}
);
zr.refresh();
}
......
src/component/tooltip.js
浏览文件 @ fb1ec727
......@@ -262,6 +262,7 @@ define(function (require) {
var xAxisIndex;
var yAxisIndex;
if (!xAxis || !yAxis) {
_hidingTicket = setTimeout(_hide, _hideDelay);
return;
}
for (var i = 0, l = series.length; i < l; i++) {
......
src/config.js
浏览文件 @ fb1ec727
......@@ -329,6 +329,8 @@ define(function() {
// radius: [0, min(width,height) - 50],
startAngle: 0,
minAngle: 5,
selectedOffset: 10, // 选中是扇区偏移量
// selectedMode: false, // 选中模式，默认关闭，可选single，multiple
itemStyle: {
normal: {
label: {
......@@ -367,6 +369,7 @@ define(function() {
map: {
mapType: 'china',
// selectedMode: false, // 选中模式，默认关闭，可选single，multiple
itemStyle: {
normal: {
// color: 各异,
......@@ -427,6 +430,7 @@ define(function() {
DATA_RANGE: 'dataRange',
LEGEND_SELECTED: 'legendSelected',
MAP_SELECTED: 'mapSelected',
PIE_SELECTED: 'pieSelected',
MAGIC_TYPE_CHANGED: 'magicTypeChanged',
DATA_VIEW_CHANGED: 'dataViewChanged'
},
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或