Skip to content

I
incubator-echarts

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

从无法访问的项目Fork

通知 1
Star 0
Fork 0
I
incubator-echarts

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

提交 3f62bdc3 编写于 作者: L lang
浏览文件
操作

force category 兼容 chords

上级 bed6a386
隐藏空白更改
内联 并排
Showing with 132 addition and 75 deletion
src/chart/chord.js
浏览文件 @ 3f62bdc3
......@@ -110,10 +110,18 @@ define(function (require) {
},
_getNodeQueryTarget: function (serie, group) {
var category = this._getNodeCategory(serie, group) || {};
var category = this._getNodeCategory(serie, group);
return [group, category, serie];;
},
_getEdgeQueryTarget: function (serie, edge, type) {
type = type || 'normal';
return [
(edge.itemStyle && edge.itemStyle[type]),
serie.itemStyle[type].chordStyle
];
},
_buildChords: function (series) {
var graphs = [];
var mainSerie = series[0];
......@@ -136,6 +144,8 @@ define(function (require) {
return n.layout.size > 0;
}, this);
graphs.push(graph);
graph.__serie = serie;
}
}
if (!graphs.length) {
......@@ -359,9 +369,11 @@ define(function (require) {
});
for (var i = 0; i < graphs.length; i++) {
graphs[i].eachEdge(function (e) {
var queryTarget = [e.data, mainSerie];
var queryTarget = self._getEdgeQueryTarget(
graphs[i].__serie, e.data
);
e.shape.style.opacity = self.deepQuery(
queryTarget, 'itemStyle.normal.chordStyle.opacity'
queryTarget, 'opacity'
) * 0.1;
e.shape.modSelf();
});
......@@ -375,9 +387,11 @@ define(function (require) {
if (n) { // 节点有可能没数据被过滤掉了
for (var j = 0; j < n.outEdges.length; j++) {
var e = n.outEdges[j];
var queryTarget = [e.data, mainSerie];
var queryTarget = self._getEdgeQueryTarget(
graphs[i].__serie, e.data
);
e.shape.style.opacity = self.deepQuery(
queryTarget, 'itemStyle.normal.chordStyle.opacity'
queryTarget, 'opacity'
);
var other = graphs[0].getNodeById(e.node2.id);
if (other) {
......@@ -656,7 +670,10 @@ define(function (require) {
// 使用系列颜色
color = this.getColor(serie.name);
}
var queryTarget = [edge.data, mainSerie];
var queryTarget = this._getEdgeQueryTarget(serie, edge.data);
var queryTargetEmphasis = this._getEdgeQueryTarget(
serie, edge.data, 'emphasis'
);
var ribbon = new RibbonShape({
zlevel: this.getZlevelBase(),
style: {
......@@ -669,7 +686,7 @@ define(function (require) {
target1: t1,
brushType: 'both',
opacity: this.deepQuery(
queryTarget, 'itemStyle.normal.chordStyle.opacity'
queryTarget, 'opacity'
),
color: color,
lineWidth: ribbonStyle.borderWidth,
......@@ -710,7 +727,11 @@ define(function (require) {
graph.eachEdge(function (e) {
var shape1 = e.node1.shape;
var shape2 = e.node2.shape;
var queryTarget = [e.data, mainSerie];
var queryTarget = this._getEdgeQueryTarget(serie, e.data);
var queryTargetEmphasis = this._getEdgeQueryTarget(
serie, e.data, 'emphasis'
);
var curveShape = new BezierCurveShape({
zlevel: this.getZlevelBase(),
z: 0,
......@@ -722,13 +743,24 @@ define(function (require) {
cpX1: center[0],
cpY1: center[1],
lineWidth: this.deepQuery(
queryTarget, 'itemStyle.normal.chordStyle.width'
queryTarget, 'width'
),
strokeColor: this.deepQuery(
queryTarget, 'color'
),
opacity: this.deepQuery(
queryTarget, 'opacity'
)
},
highlightStyle: {
lineWidth: this.deepQuery(
queryTargetEmphasis, 'width'
),
strokeColor: this.deepQuery(
queryTarget, 'itemStyle.normal.chordStyle.color'
queryTargetEmphasis, 'color'
),
opacity: this.deepQuery(
queryTarget, 'itemStyle.normal.chordStyle.opacity'
queryTargetEmphasis, 'opacity'
)
}
});
......@@ -878,7 +910,6 @@ define(function (require) {
};
}
else {
var colorIndices = {};
var colorMap = {};
var count = 0;
this.getColor = function (key) {
......
src/chart/force.js
浏览文件 @ 3f62bdc3
......@@ -65,7 +65,8 @@ define(function (require) {
this.onmousemove = function() {
onmousemove.apply(self, arguments);
};
this._init();
this.refresh(option);
}
/**
......@@ -114,14 +115,33 @@ define(function (require) {
}
// TODO 多个 force
this._forceSerie = serie;
this._initSerie(serie);
break;
}
}
},
_getNodeCategory: function (serie, node) {
return serie.categories && serie.categories[node.category || 0];
},
_getNodeQueryTarget: function (serie, node) {
var category = this._getNodeCategory(serie, node) || {};
return [
node.itemStyle && node.itemStyle.normal,
category && category.itemStyle && category.itemStyle.normal,
serie.itemStyle.normal.nodeStyle
];
},
_getEdgeQueryTarget: function (serie, edge, type) {
type = type || 'normal';
return [
(edge.itemStyle && edge.itemStyle[type]),
serie.itemStyle[type].linkStyle
];
},
_initSerie: function(serie) {
this._temperature = 1;
......@@ -271,48 +291,41 @@ define(function (require) {
var graph = this._graph;
var categories = this.query(serie, 'categories');
var len = graph.nodes.length;
var legend = this.component.legend;
for (var i = 0; i < len; i++) {
var gNode = graph.nodes[i];
var node = gNode.data;
graph.eachNode(function (node) {
var category = this._getNodeCategory(serie, node.data);
var queryTarget = [node.data, category, serie];
var styleQueryTarget = this._getNodeQueryTarget(serie, node.data);
var emphasisStyleQueryTarget = this._getNodeQueryTarget(
serie, node.data, 'emphasis'
);
var shape = new IconShape({
style : {
x : 0,
y : 0
style: {
x: 0,
y: 0,
color: this.deepQuery(styleQueryTarget, 'color'),
// 兼容原有写法
strokeColor: this.deepQuery(styleQueryTarget, 'strokeColor')
|| this.deepQuery(styleQueryTarget, 'borderColor'),
lineWidth: this.deepQuery(styleQueryTarget, 'lineWidth')
|| this.deepQuery(styleQueryTarget, 'borderWidth')
},
clickable: this.query(serie, 'clickable'),
highlightStyle : {}
highlightStyle: {
color: this.deepQuery(styleQueryTarget, 'color', 'emphasis'),
// 兼容原有写法
strokeColor: this.deepQuery(styleQueryTarget, 'strokeColor', 'emphasis')
|| this.deepQuery(styleQueryTarget, 'borderColor', 'emphasis'),
lineWidth: this.deepQuery(styleQueryTarget, 'lineWidth', 'emphasis')
|| this.deepQuery(styleQueryTarget, 'borderWidth', 'emphasis')
},
clickable: serie.clickable
});
var queryTarget = [];
var shapeNormalStyle = [];
var shapeEmphasisStyle = [];
queryTarget.push(node);
if (node.itemStyle) {
shapeNormalStyle.push(node.itemStyle.normal);
shapeEmphasisStyle.push(node.itemStyle.emphasis);
if (!shape.style.color) {
shape.style.color = category
? this.getColor(category.name) : this.getColor(node.id);
}
if (typeof(node.category) !== 'undefined') {
var category = categories[node.category];
if (category) {
// 使用 Legend.getColor 配置默认 category 的默认颜色
category.itemStyle = category.itemStyle || {};
category.itemStyle.normal = category.itemStyle.normal || {};
category.itemStyle.normal.color = category.itemStyle.normal.color
|| legend.getColor(category.name);
queryTarget.push(category);
shapeNormalStyle.unshift(category.itemStyle.normal);
shapeEmphasisStyle.unshift(category.itemStyle.emphasis);
}
}
queryTarget.push(serie);
shapeNormalStyle.unshift(serie.itemStyle.normal.nodeStyle);
shapeEmphasisStyle.unshift(serie.itemStyle.emphasis.nodeStyle);
shape.style.iconType = this.deepQuery(queryTarget, 'symbol');
// 强制设定节点大小，否则默认映射到 minRadius 到 maxRadius 后的值
......@@ -330,18 +343,6 @@ define(function (require) {
});
}
// 节点样式
for (var k = 0; k < shapeNormalStyle.length; k++) {
if (shapeNormalStyle[k]) {
zrUtil.merge(shape.style, shapeNormalStyle[k], true);
}
}
// 节点高亮样式
for (var k = 0; k < shapeEmphasisStyle.length; k++) {
if (shapeEmphasisStyle[k]) {
zrUtil.merge(shape.highlightStyle, shapeEmphasisStyle[k], true);
}
}
// 兼容原有写法
shape.style.strokeColor = shape.style.strokeColor || shape.style.borderColor;
shape.style.lineWidth = shape.style.lineWidth || shape.style.borderWidth;
......@@ -352,7 +353,7 @@ define(function (require) {
// 节点标签样式
if (this.deepQuery(queryTarget, 'itemStyle.normal.label.show')) {
shape.style.text = node.name;
shape.style.text = node.data.name;
shape.style.textPosition = 'inside';
var labelStyle = this.deepQuery(
queryTarget, 'itemStyle.normal.label.textStyle'
......@@ -364,7 +365,7 @@ define(function (require) {
}
if (this.deepQuery(queryTarget, 'itemStyle.emphasis.label.show')) {
shape.highlightStyle.text = node.name;
shape.highlightStyle.text = node.data.name;
shape.highlightStyle.textPosition = 'inside';
var labelStyle = this.deepQuery(
queryTarget, 'itemStyle.emphasis.label.textStyle'
......@@ -399,20 +400,20 @@ define(function (require) {
// series index
0,
// data
node,
node.data,
// data index
gNode.rawIndex,
node.rawIndex,
// name
node.name || '',
node.data.name || '',
// value
node.value
node.data.value
);
this.shapeList.push(shape);
this.zr.addShape(shape);
gNode.shape = shape;
}
node.shape = shape;
}, this);
},
_buildLinkShapes: function(serie) {
......@@ -470,7 +471,6 @@ define(function (require) {
linkShape.highlightStyle.strokeColor
= linkShape.highlightStyle.strokeColor || linkShape.highlightStyle.color;
ecData.pack(
linkShape,
// serie
......@@ -622,6 +622,34 @@ define(function (require) {
this.option = newOption;
this.series = this.option.series;
}
this.legend = this.component.legend;
if (this.legend) {
this.getColor = function(param) {
return this.legend.getColor(param);
};
this.isSelected = function(param) {
return this.legend.isSelected(param);
};
}
else {
var colorMap = {};
var count = 0;
this.getColor = function (key) {
if (colorMap[key]) {
return colorMap[key];
}
if (!colorMap[key]) {
colorMap[key] = this.zr.getColor(count++);
}
return colorMap[key];
};
this.isSelected = function () {
return true;
};
}
this._init();
},
......
src/config.js
浏览文件 @ 3f62bdc3
......@@ -867,12 +867,12 @@ define(function() {
clickable: true,
// 分类里如果有样式会覆盖节点默认样式
categories: [{
// categories: [{
// itemStyle
// symbol
// symbolSize
// name
}],
// }],
itemStyle: {
normal: {
// color: 各异,
......@@ -881,8 +881,6 @@ define(function() {
// textStyle: null // 默认使用全局文本样式，详见TEXTSTYLE
},
nodeStyle: {
brushType: 'both',
color: '#f08c2e',
borderColor: '#5182ab',
borderWidth: 1
},
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或