提交 5316d9ad 编写于 作者: K kener

图表重构 chrod

上级 90fc89c3
...@@ -26,129 +26,102 @@ define(function (require) { ...@@ -26,129 +26,102 @@ define(function (require) {
var _devicePixelRatio = window.devicePixelRatio || 1; var _devicePixelRatio = window.devicePixelRatio || 1;
function Chord(ecTheme, messageCenter, zr, option, component) { function Chord(ecTheme, messageCenter, zr, option, component) {
var self = this;
ComponentBase.call(this, ecTheme, zr, option); ComponentBase.call(this, ecTheme, zr, option);
CalculableBase.call(this); CalculableBase.call(this);
var legend; this.init(option, component);
var getColor; }
var isSelected;
Chord.prototype = {
var series; type : ecConfig.CHART_TYPE_CHORD,
this.type = ecConfig.CHART_TYPE_CHORD; /**
* 绘制图形
var _zlevelBase = self.getZlevelBase(); */
_buildShape : function () {
var chordSerieSample; var series = this.series;
// Config this.selectedMap = {};
var chordSeries = []; this.chordSeries = [];
var groups; this.chordSerieSample = null;
var startAngle;
var clockWise;
var innerRadius;
var outerRadius;
var padding;
var sortGroups;
var sortSubGroups;
var center;
var showScale;
var showScaleText;
var strokeFix = 0;
// Adjacency matrix
var dataMat;
var sectorShapes = [];
var chordShapes = [];
var scaleLineLength = 4;
var scaleUnitAngle = 4;
function _buildShape() {
self.selectedMap = {};
chordSeries = [];
chordSerieSample = null;
var matrix = []; var matrix = [];
var serieNumber = 0; var serieNumber = 0;
for (var i = 0, l = series.length; i < l; i++) { for (var i = 0, l = series.length; i < l; i++) {
if (series[i].type === self.type) { if (series[i].type === this.type) {
// Use the config of first chord serie // Use the config of first chord serie
if (!chordSerieSample) { if (!this.chordSerieSample) {
chordSerieSample = series[i]; this.chordSerieSample = series[i];
self.reformOption(chordSerieSample); this.reformOption(this.chordSerieSample);
} }
var _isSelected = isSelected(series[i].name); var _isSelected = this.isSelected(series[i].name);
// Filter by selected serie // Filter by selected serie
self.selectedMap[series[i].name] = _isSelected; this.selectedMap[series[i].name] = _isSelected;
if (!_isSelected) { if (!_isSelected) {
continue; continue;
} }
chordSeries.push(series[i]); this.chordSeries.push(series[i]);
self.buildMark( this.buildMark(
series[i], series[i],
i, i,
component this.component
); );
matrix.push(series[i].matrix); matrix.push(series[i].matrix);
serieNumber++; serieNumber++;
} }
} }
if (!chordSerieSample) { if (!this.chordSerieSample) {
return; return;
} }
if (!chordSeries.length) { if (!this.chordSeries.length) {
return; return;
} }
var zrWidth = zr.getWidth(); var zrWidth = this.zr.getWidth();
var zrHeight = zr.getHeight(); var zrHeight = this.zr.getHeight();
var zrSize = Math.min(zrWidth, zrHeight); var zrSize = Math.min(zrWidth, zrHeight);
groups = chordSerieSample.data; this.groups = this.chordSerieSample.data;
startAngle = chordSerieSample.startAngle; this.startAngle = this.chordSerieSample.startAngle;
// Constrain to [0, 360] // Constrain to [0, 360]
startAngle = startAngle % 360; this.startAngle = this.startAngle % 360;
if (startAngle < 0) { if (this.startAngle < 0) {
startAngle = startAngle + 360; this.startAngle = this.startAngle + 360;
} }
clockWise = chordSerieSample.clockWise; this.clockWise = this.chordSerieSample.clockWise;
innerRadius = self.parsePercent( this.innerRadius = this.parsePercent(
chordSerieSample.radius[0], this.chordSerieSample.radius[0],
zrSize / 2 zrSize / 2
); );
outerRadius = self.parsePercent( this.outerRadius = this.parsePercent(
chordSerieSample.radius[1], this.chordSerieSample.radius[1],
zrSize / 2 zrSize / 2
); );
padding = chordSerieSample.padding; this.padding = this.chordSerieSample.padding;
sortGroups = chordSerieSample.sort; this.sortGroups = this.chordSerieSample.sort;
sortSubGroups = chordSerieSample.sortSub; this.sortSubGroups = this.chordSerieSample.sortSub;
showScale = chordSerieSample.showScale; this.showScale = this.chordSerieSample.showScale;
showScaleText = chordSerieSample.showScaleText; this.showScaleText = this.chordSerieSample.showScaleText;
center = [ this.center = [
self.parsePercent(chordSerieSample.center[0], zrWidth), this.parsePercent(this.chordSerieSample.center[0], zrWidth),
self.parsePercent(chordSerieSample.center[1], zrHeight) this.parsePercent(this.chordSerieSample.center[1], zrHeight)
]; ];
var fixSize = var fixSize =
chordSerieSample.itemStyle.normal.chordStyle.lineStyle.width - this.chordSerieSample.itemStyle.normal.chordStyle.lineStyle.width -
chordSerieSample.itemStyle.normal.lineStyle.width; this.chordSerieSample.itemStyle.normal.lineStyle.width;
strokeFix = this.strokeFix =
(fixSize / _devicePixelRatio) / innerRadius / Math.PI * 180; (fixSize / _devicePixelRatio) / this.innerRadius / Math.PI * 180;
dataMat = new NDArray(matrix); this.dataMat = new NDArray(matrix);
dataMat = dataMat._transposelike([1, 2, 0]); this.dataMat = this.dataMat._transposelike([1, 2, 0]);
// Filter the data by selected legend // Filter the data by selected legend
var res = _filterData(dataMat, groups); var res = this._filterData(this.dataMat, this.groups);
dataMat = res[0]; this.dataMat = res[0];
groups = res[1]; this.groups = res[1];
// Check if data is valid // Check if data is valid
var shape = dataMat.shape(); var shape = this.dataMat.shape();
if (shape[0] !== shape[1] || shape[0] !== groups.length) { if (shape[0] !== shape[1] || shape[0] !== this.groups.length) {
throw new Error('Data not valid'); throw new Error('Data not valid');
} }
if (shape[0] === 0 || shape[2] === 0) { if (shape[0] === 0 || shape[2] === 0) {
...@@ -157,41 +130,41 @@ define(function (require) { ...@@ -157,41 +130,41 @@ define(function (require) {
// Down to 2 dimension // Down to 2 dimension
// More convenient for angle calculating and sort // More convenient for angle calculating and sort
dataMat.reshape(shape[0], shape[1] * shape[2]); this.dataMat.reshape(shape[0], shape[1] * shape[2]);
// Processing data // Processing data
var sumOut = dataMat.sum(1); var sumOut = this.dataMat.sum(1);
var percents = sumOut.mul(1 / sumOut.sum()); var percents = sumOut.mul(1 / sumOut.sum());
var groupNumber = shape[0]; var groupNumber = shape[0];
var subGroupNumber = shape[1] * shape[2]; var subGroupNumber = shape[1] * shape[2];
var groupAngles = percents.mul(360 - padding * groupNumber); var groupAngles = percents.mul(360 - this.padding * groupNumber);
var subGroupAngles = dataMat.div( var subGroupAngles = this.dataMat.div(
dataMat.sum(1).reshape(groupNumber, 1) this.dataMat.sum(1).reshape(groupNumber, 1)
); );
subGroupAngles = subGroupAngles.mul( subGroupAngles = subGroupAngles.mul(
groupAngles.sub(strokeFix * 2).reshape(groupNumber, 1) groupAngles.sub(this.strokeFix * 2).reshape(groupNumber, 1)
); );
switch (sortGroups) { switch (this.sortGroups) {
case 'ascending': case 'ascending':
case 'descending': case 'descending':
var groupIndices = groupAngles var groupIndices = groupAngles
.argsort(0, sortGroups); .argsort(0, this.sortGroups);
groupAngles['sort'](0, sortGroups); groupAngles['sort'](0, this.sortGroups);
sumOut['sort'](0, sortGroups); sumOut['sort'](0, this.sortGroups);
break; break;
default: default:
var groupIndices = NDArray.range(shape[0]); var groupIndices = NDArray.range(shape[0]);
} }
switch (sortSubGroups) { switch (this.sortSubGroups) {
case 'ascending': case 'ascending':
case 'descending': case 'descending':
var subGroupIndices = subGroupAngles var subGroupIndices = subGroupAngles
.argsort(1, sortSubGroups); .argsort(1, this.sortSubGroups);
subGroupAngles['sort'](1, sortSubGroups); subGroupAngles['sort'](1, this.sortSubGroups);
break; break;
default: default:
var subGroupIndices = NDArray var subGroupIndices = NDArray
...@@ -221,7 +194,7 @@ define(function (require) { ...@@ -221,7 +194,7 @@ define(function (require) {
sectorAngles[sortedIdx] = [start, end]; sectorAngles[sortedIdx] = [start, end];
// Sub Group // Sub Group
var subStart = start + strokeFix; var subStart = start + this.strokeFix;
var subEnd = subStart; var subEnd = subStart;
for (var j = 0; j < subGroupNumber; j++) { for (var j = 0; j < subGroupNumber; j++) {
subEnd = subStart + subGroupAnglesArr[sortedIdx][j]; subEnd = subStart + subGroupAnglesArr[sortedIdx][j];
...@@ -232,40 +205,40 @@ define(function (require) { ...@@ -232,40 +205,40 @@ define(function (require) {
subStart = subEnd; subStart = subEnd;
} }
start = end + padding; start = end + this.padding;
} }
// reset data // reset data
chordShapes = new NDArray(groupNumber, groupNumber, serieNumber) this.chordShapes = new NDArray(groupNumber, groupNumber, serieNumber)
.toArray(); .toArray();
sectorShapes = []; this.sectorShapes = [];
_buildSectors(sectorAngles, values); this._buildSectors(sectorAngles, values);
chordAngles = new NDArray(chordAngles).reshape( chordAngles = new NDArray(chordAngles).reshape(
groupNumber, groupNumber, serieNumber, 2 groupNumber, groupNumber, serieNumber, 2
).toArray(); ).toArray();
_buildChords(chordAngles, dataMat.reshape(shape).toArray()); this._buildChords(chordAngles, this.dataMat.reshape(shape).toArray());
var res = normalizeValue(values); var res = this.normalizeValue(values);
if (showScale) { if (this.showScale) {
_buildScales( this._buildScales(
res[0], res[0],
res[1], res[1],
sectorAngles, sectorAngles,
new NDArray(res[0]).sum() / (360 - padding * groupNumber) new NDArray(res[0]).sum() / (360 - this.padding * groupNumber)
); );
} }
} },
function _filterData (dataMat, groups) { _filterData : function (dataMat, groups) {
var indices = []; var indices = [];
var groupsFilted = []; var groupsFilted = [];
// Filter by selected group // Filter by selected group
for (var i = 0; i < groups.length; i++) { for (var i = 0; i < groups.length; i++) {
var name = groups[i].name; var name = groups[i].name;
self.selectedMap[name] = isSelected(name); this.selectedMap[name] = this.isSelected(name);
if (!self.selectedMap[name]) { if (!this.selectedMap[name]) {
indices.push(i); indices.push(i);
} else { } else {
groupsFilted.push(groups[i]); groupsFilted.push(groups[i]);
...@@ -298,21 +271,22 @@ define(function (require) { ...@@ -298,21 +271,22 @@ define(function (require) {
} }
return [dataMat, groupsFilted2]; return [dataMat, groupsFilted2];
} },
function _buildSectors(angles, data) { _buildSectors : function (angles, data) {
var len = groups.length; var len = this.groups.length;
var len2 = chordSeries.length; var len2 = this.chordSeries.length;
var timeout; var timeout;
var showLabel = self.query( var showLabel = this.query(
chordSerieSample, 'itemStyle.normal.label.show' this.chordSerieSample, 'itemStyle.normal.label.show'
); );
var labelColor = self.query( var labelColor = this.query(
chordSerieSample, 'itemStyle.normal.label.color' this.chordSerieSample, 'itemStyle.normal.label.color'
); );
var self = this;
function createMouseOver(idx) { function createMouseOver(idx) {
return function () { return function () {
if (timeout) { if (timeout) {
...@@ -320,26 +294,26 @@ define(function (require) { ...@@ -320,26 +294,26 @@ define(function (require) {
} }
timeout = setTimeout(function (){ timeout = setTimeout(function (){
for (var i = 0; i < len; i++) { for (var i = 0; i < len; i++) {
sectorShapes[i].style.opacity self.sectorShapes[i].style.opacity
= i === idx ? 1 : 0.1; = i === idx ? 1 : 0.1;
zr.modShape( self.zr.modShape(
sectorShapes[i].id, self.sectorShapes[i].id,
sectorShapes[i] self.sectorShapes[i]
); );
for (var j = 0; j < len; j++) { for (var j = 0; j < len; j++) {
for (var k = 0; k < len2; k++) { for (var k = 0; k < len2; k++) {
var chordShape = chordShapes[i][j][k]; var chordShape = self.chordShapes[i][j][k];
if (chordShape) { if (chordShape) {
chordShape.style.opacity chordShape.style.opacity
= (i === idx || j === idx) = (i === idx || j === idx)
? 0.5 : 0.03; ? 0.5 : 0.03;
zr.modShape(chordShape.id, chordShape); self.zr.modShape(chordShape.id, chordShape);
} }
} }
} }
} }
zr.refresh(); self.zr.refresh();
}, 50); }, 50);
}; };
} }
...@@ -351,64 +325,61 @@ define(function (require) { ...@@ -351,64 +325,61 @@ define(function (require) {
} }
timeout = setTimeout(function (){ timeout = setTimeout(function (){
for (var i = 0; i < len; i++) { for (var i = 0; i < len; i++) {
sectorShapes[i].style.opacity = 1.0; self.sectorShapes[i].style.opacity = 1.0;
zr.modShape(sectorShapes[i].id, sectorShapes[i]); self.zr.modShape(self.sectorShapes[i].id, self.sectorShapes[i]);
for (var j = 0; j < len; j++) { for (var j = 0; j < len; j++) {
for (var k = 0; k < len2; k++) { for (var k = 0; k < len2; k++) {
var chordShape = chordShapes[i][j][k]; var chordShape = self.chordShapes[i][j][k];
if (chordShape) { if (chordShape) {
chordShape.style.opacity = 0.5; chordShape.style.opacity = 0.5;
zr.modShape(chordShape.id, chordShape); self.zr.modShape(chordShape.id, chordShape);
} }
} }
} }
} }
zr.refresh(); self.zr.refresh();
}, 50); }, 50);
}; };
} }
for (var i = 0; i < len; i++) { for (var i = 0; i < len; i++) {
var group = this.groups[i];
var group = groups[i];
var angle = angles[i]; var angle = angles[i];
var _start = (clockWise ? (360 - angle[1]) : angle[0]) var _start = (this.clockWise ? (360 - angle[1]) : angle[0]) + this.startAngle;
+ startAngle; var _end = (this.clockWise ? (360 - angle[0]) : angle[1]) + this.startAngle;
var _end = (clockWise ? (360 - angle[0]) : angle[1])
+ startAngle;
var sector = { var sector = {
zlevel : _zlevelBase, zlevel : this._zlevelBase,
style : { style : {
x : center[0], x : this.center[0],
y : center[1], y : this.center[1],
r0 : innerRadius, r0 : this.innerRadius,
r : outerRadius, r : this.outerRadius,
startAngle : _start, startAngle : _start,
endAngle : _end, endAngle : _end,
brushType : 'fill', brushType : 'fill',
opacity: 1, opacity: 1,
color : getColor(group.name) color : this.getColor(group.name)
}, },
highlightStyle : { highlightStyle : {
brushType : 'fill' brushType : 'fill'
} }
}; };
sector.style.lineWidth = self.deepQuery( sector.style.lineWidth = this.deepQuery(
[group, chordSerieSample], [group, this.chordSerieSample],
'itemStyle.normal.lineStyle.width' 'itemStyle.normal.lineStyle.width'
); );
sector.highlightStyle.lineWidth = self.deepQuery( sector.highlightStyle.lineWidth = this.deepQuery(
[group, chordSerieSample], [group, this.chordSerieSample],
'itemStyle.emphasis.lineStyle.width' 'itemStyle.emphasis.lineStyle.width'
); );
sector.style.strokeColor = self.deepQuery( sector.style.strokeColor = this.deepQuery(
[group, chordSerieSample], [group, this.chordSerieSample],
'itemStyle.normal.lineStyle.color' 'itemStyle.normal.lineStyle.color'
); );
sector.highlightStyle.strokeColor = self.deepQuery( sector.highlightStyle.strokeColor = this.deepQuery(
[group, chordSerieSample], [group, this.chordSerieSample],
'itemStyle.emphasis.lineStyle.color' 'itemStyle.emphasis.lineStyle.color'
); );
if (sector.style.lineWidth > 0) { if (sector.style.lineWidth > 0) {
...@@ -419,7 +390,7 @@ define(function (require) { ...@@ -419,7 +390,7 @@ define(function (require) {
} }
ecData.pack( ecData.pack(
sector, sector,
chordSeries[0], this.chordSeries[0],
0, 0,
data[i], 0, data[i], 0,
group.name group.name
...@@ -432,12 +403,12 @@ define(function (require) { ...@@ -432,12 +403,12 @@ define(function (require) {
halfAngle = halfAngle * Math.PI / 180; halfAngle = halfAngle * Math.PI / 180;
var v = [Math.cos(halfAngle), -Math.sin(halfAngle)]; var v = [Math.cos(halfAngle), -Math.sin(halfAngle)];
var distance = showScaleText ? 45 : 20; var distance = this.showScaleText ? 45 : 20;
var start = vec2.scale([], v, outerRadius + distance); var start = vec2.scale([], v, this.outerRadius + distance);
vec2.add(start, start, center); vec2.add(start, start, this.center);
var labelShape = { var labelShape = {
zlevel : _zlevelBase - 1, zlevel : this._zlevelBase - 1,
hoverable : false, hoverable : false,
style : { style : {
x : start[0], x : start[0],
...@@ -447,30 +418,30 @@ define(function (require) { ...@@ -447,30 +418,30 @@ define(function (require) {
color : labelColor color : labelColor
} }
}; };
labelShape.style.textColor = self.deepQuery( labelShape.style.textColor = this.deepQuery(
[group, chordSerieSample], [group, this.chordSerieSample],
'itemStyle.normal.label.textStyle.color' 'itemStyle.normal.label.textStyle.color'
) || '#fff'; ) || '#fff';
labelShape.style.textFont = self.getFont(self.deepQuery( labelShape.style.textFont = this.getFont(this.deepQuery(
[group, chordSerieSample], [group, this.chordSerieSample],
'itemStyle.normal.label.textStyle' 'itemStyle.normal.label.textStyle'
)); ));
labelShape = new TextShape(labelShape) labelShape = new TextShape(labelShape)
self.shapeList.push(labelShape); this.shapeList.push(labelShape);
zr.addShape(labelShape); this.zr.addShape(labelShape);
} }
sector.onmouseover = createMouseOver(i); sector.onmouseover = createMouseOver(i);
sector.onmouseout = createMouseOut(); sector.onmouseout = createMouseOut();
sector = new SectorShape(sector); sector = new SectorShape(sector);
self.shapeList.push(sector); this.shapeList.push(sector);
sectorShapes.push(sector); this.sectorShapes.push(sector);
zr.addShape(sector); this.zr.addShape(sector);
} }
} },
function _buildChords(angles, dataArr) { _buildChords : function (angles, dataArr) {
var len = angles.length; var len = angles.length;
if (!len) { if (!len) {
return; return;
...@@ -478,14 +449,14 @@ define(function (require) { ...@@ -478,14 +449,14 @@ define(function (require) {
var len2 = angles[0][0].length; var len2 = angles[0][0].length;
var chordLineStyle var chordLineStyle
= chordSerieSample.itemStyle.normal.chordStyle.lineStyle; = this.chordSerieSample.itemStyle.normal.chordStyle.lineStyle;
var chordLineStyleEmphsis var chordLineStyleEmphsis
= chordSerieSample.itemStyle.emphasis.chordStyle.lineStyle; = this.chordSerieSample.itemStyle.emphasis.chordStyle.lineStyle;
for (var i = 0; i < len; i++) { for (var i = 0; i < len; i++) {
for (var j = 0; j < len; j++) { for (var j = 0; j < len; j++) {
for (var k = 0; k < len2; k++) { for (var k = 0; k < len2; k++) {
if (chordShapes[j][i][k]) { if (this.chordShapes[j][i][k]) {
continue; continue;
} }
...@@ -497,33 +468,33 @@ define(function (require) { ...@@ -497,33 +468,33 @@ define(function (require) {
if (angleIJ0 - angleJI1 === 0 || if (angleIJ0 - angleJI1 === 0 ||
angleJI0 - angleJI1 === 0) { angleJI0 - angleJI1 === 0) {
chordShapes[i][j][k] = null; this.chordShapes[i][j][k] = null;
continue; continue;
} }
var color; var color;
if (len2 === 1) { if (len2 === 1) {
if (angleIJ1 - angleIJ0 <= angleJI1 - angleJI0) { if (angleIJ1 - angleIJ0 <= angleJI1 - angleJI0) {
color = getColor(groups[i].name); color = this.getColor(this.groups[i].name);
} else { } else {
color = getColor(groups[j].name); color = this.getColor(this.groups[j].name);
} }
} else { } else {
color = getColor(chordSeries[k].name); color = this.getColor(this.chordSeries[k].name);
} }
var s0 = !clockWise ? (360 - angleIJ1) : angleIJ0; var s0 = !this.clockWise ? (360 - angleIJ1) : angleIJ0;
var s1 = !clockWise ? (360 - angleIJ0) : angleIJ1; var s1 = !this.clockWise ? (360 - angleIJ0) : angleIJ1;
var t0 = !clockWise ? (360 - angleJI1) : angleJI0; var t0 = !this.clockWise ? (360 - angleJI1) : angleJI0;
var t1 = !clockWise ? (360 - angleJI0) : angleJI1; var t1 = !this.clockWise ? (360 - angleJI0) : angleJI1;
var chord = { var chord = {
zlevel : _zlevelBase, zlevel : this._zlevelBase,
style : { style : {
center : center, center : this.center,
r : innerRadius, r : this.innerRadius,
source0 : s0 - startAngle, source0 : s0 - this.startAngle,
source1 : s1 - startAngle, source1 : s1 - this.startAngle,
target0 : t0 - startAngle, target0 : t0 - this.startAngle,
target1 : t1 - startAngle, target1 : t1 - this.startAngle,
brushType : 'both', brushType : 'both',
opacity : 0.5, opacity : 0.5,
color : color, color : color,
...@@ -539,24 +510,24 @@ define(function (require) { ...@@ -539,24 +510,24 @@ define(function (require) {
ecData.pack( ecData.pack(
chord, chord,
chordSeries[k], this.chordSeries[k],
k, k,
dataArr[i][j][k], 0, dataArr[i][j][k], 0,
groups[i].name, this.groups[i].name,
groups[j].name, this.groups[j].name,
dataArr[j][i][k] dataArr[j][i][k]
); );
chord = new ChordShape(chord); chord = new ChordShape(chord);
chordShapes[i][j][k] = chord; this.chordShapes[i][j][k] = chord;
self.shapeList.push(chord); this.shapeList.push(chord);
zr.addShape(chord); this.zr.addShape(chord);
} }
} }
} }
} },
function _buildScales( _buildScales : function (
values, values,
unitPostfix, unitPostfix,
angles, angles,
...@@ -568,18 +539,18 @@ define(function (require) { ...@@ -568,18 +539,18 @@ define(function (require) {
var scaleAngle = subStartAngle; var scaleAngle = subStartAngle;
while (scaleAngle < subEndAngle) { while (scaleAngle < subEndAngle) {
var thelta = ((clockWise ? (360 - scaleAngle) : scaleAngle) var thelta = ((this.clockWise ? (360 - scaleAngle) : scaleAngle)
+ startAngle) / 180 * Math.PI; + this.startAngle) / 180 * Math.PI;
var v = [ var v = [
Math.cos(thelta), Math.cos(thelta),
-Math.sin(thelta) -Math.sin(thelta)
]; ];
var start = vec2.scale([], v, outerRadius + 1); var start = vec2.scale([], v, this.outerRadius + 1);
vec2.add(start, start, center); vec2.add(start, start, this.center);
var end = vec2.scale([], v, outerRadius + scaleLineLength); var end = vec2.scale([], v, this.outerRadius + this.scaleLineLength);
vec2.add(end, end, center); vec2.add(end, end, this.center);
var scaleShape = { var scaleShape = {
zlevel : _zlevelBase - 1, zlevel : this._zlevelBase - 1,
hoverable : false, hoverable : false,
style : { style : {
xStart : start[0], xStart : start[0],
...@@ -593,37 +564,37 @@ define(function (require) { ...@@ -593,37 +564,37 @@ define(function (require) {
}; };
scaleShape = new LineShape(scaleShape); scaleShape = new LineShape(scaleShape);
self.shapeList.push(scaleShape); this.shapeList.push(scaleShape);
zr.addShape(scaleShape); this.zr.addShape(scaleShape);
scaleAngle += scaleUnitAngle; scaleAngle += this.scaleUnitAngle;
} }
if (!showScaleText) { if (!this.showScaleText) {
continue; continue;
} }
var scaleTextAngle = subStartAngle; var scaleTextAngle = subStartAngle;
var step = unitValue * 5 * scaleUnitAngle; var step = unitValue * 5 * this.scaleUnitAngle;
var scaleValues = NDArray.range(0, values[i], step).toArray(); var scaleValues = NDArray.range(0, values[i], step).toArray();
while (scaleTextAngle < subEndAngle) { while (scaleTextAngle < subEndAngle) {
var thelta = clockWise var thelta = this.clockWise
? (360 - scaleTextAngle) : scaleTextAngle; ? (360 - scaleTextAngle) : scaleTextAngle;
thelta = (thelta + startAngle) % 360; thelta = (thelta + this.startAngle) % 360;
var isRightSide = thelta <= 90 var isRightSide = thelta <= 90
|| thelta >= 270; || thelta >= 270;
var textShape = { var textShape = {
zlevel : _zlevelBase - 1, zlevel : this._zlevelBase - 1,
hoverable : false, hoverable : false,
style : { style : {
x : isRightSide x : isRightSide
? outerRadius + scaleLineLength + 4 ? this.outerRadius + this.scaleLineLength + 4
: -outerRadius - scaleLineLength - 4, : -this.outerRadius - this.scaleLineLength - 4,
y : 0, y : 0,
text : Math.round(scaleValues.shift()*10)/10 text : Math.round(scaleValues.shift()*10)/10
+ unitPostfix, + unitPostfix,
textAlign : isRightSide ? 'left' : 'right' textAlign : isRightSide ? 'left' : 'right'
}, },
position : center.slice(), position : this.center.slice(),
rotation : isRightSide rotation : isRightSide
? [thelta / 180 * Math.PI, 0, 0] ? [thelta / 180 * Math.PI, 0, 0]
: [ : [
...@@ -633,14 +604,14 @@ define(function (require) { ...@@ -633,14 +604,14 @@ define(function (require) {
}; };
textShape = new TextShape(textShape); textShape = new TextShape(textShape);
self.shapeList.push(textShape); this.shapeList.push(textShape);
zr.addShape(textShape); this.zr.addShape(textShape);
scaleTextAngle += scaleUnitAngle * 5; scaleTextAngle += this.scaleUnitAngle * 5;
} }
} }
} },
function normalizeValue(values) { normalizeValue : function (values) {
var result = []; var result = [];
var max = new NDArray(values).max(); var max = new NDArray(values).max();
var unitPostfix, unitScale; var unitPostfix, unitScale;
...@@ -662,32 +633,64 @@ define(function (require) { ...@@ -662,32 +633,64 @@ define(function (require) {
result[i] = values[i] * unitScale; result[i] = values[i] * unitScale;
} }
return [result, unitPostfix]; return [result, unitPostfix];
} },
function init(newOption, newComponent) { init : function (newOption, newComponent) {
component = newComponent; this.component = newComponent;
refresh(newOption);
} this.refresh(newOption);
},
function refresh(newOption) { refresh : function (newOption) {
if (newOption) { if (newOption) {
option = newOption; this.option = newOption;
series = option.series; this.series = newOption.series;
} }
self.clear();
legend = component.legend; /*
if (legend) { this.legend;
getColor = function(param) { this.getColor;
return legend.getColor(param); this.isSelected;
this.chordSerieSample;
*/
// Config
this.chordSeries = [];
/*
this.groups;
this.startAngle;
this.clockWise;
this.innerRadius;
this.outerRadius;
this.padding;
this.sortGroups;
this.sortSubGroups;
this.center;
this.showScale;
this.showScaleText;
this.dataMat;
*/
this.strokeFix = 0;
// Adjacency matrix
this.sectorShapes = [];
this.chordShapes = [];
this.scaleLineLength = 4;
this.scaleUnitAngle = 4;
this.clear();
this.legend = this.component.legend;
if (this.legend) {
this.getColor = function(param) {
return this.legend.getColor(param);
}; };
isSelected = function(param) { this.isSelected = function(param) {
return legend.isSelected(param); return this.legend.isSelected(param);
}; };
} else { } else {
var colorIndices = {}; var colorIndices = {};
var colorMap = {}; var colorMap = {};
var count = 0; var count = 0;
getColor = function (key) { this.getColor = function (key) {
if (colorMap[key]) { if (colorMap[key]) {
return colorMap[key]; return colorMap[key];
} }
...@@ -695,22 +698,22 @@ define(function (require) { ...@@ -695,22 +698,22 @@ define(function (require) {
colorIndices[key] = count++; colorIndices[key] = count++;
} }
// key is serie name // key is serie name
for (var i = 0; i < chordSeries.length; i++) { for (var i = 0; i < this.chordSeries.length; i++) {
if (chordSeries[i].name === key) { if (this.chordSeries[i].name === key) {
colorMap[key] = self.query( colorMap[key] = this.query(
chordSeries[i], this.chordSeries[i],
'itemStyle.normal.color' 'itemStyle.normal.color'
); );
break; break;
} }
} }
if (!colorMap[key]) { if (!colorMap[key]) {
var len = groups.length; var len = this.groups.length;
// key is group name // key is group name
for (var i = 0; i < len; i++) { for (var i = 0; i < len; i++) {
if (groups[i].name === key) { if (this.groups[i].name === key) {
colorMap[key] = self.query( colorMap[key] = this.query(
groups[i], this.groups[i],
'itemStyle.normal.color' 'itemStyle.normal.color'
); );
break; break;
...@@ -718,36 +721,30 @@ define(function (require) { ...@@ -718,36 +721,30 @@ define(function (require) {
} }
} }
if (!colorMap[key]) { if (!colorMap[key]) {
colorMap[key] = zr.getColor(colorIndices[key]); colorMap[key] = this.zr.getColor(colorIndices[key]);
} }
return colorMap[key]; return colorMap[key];
}; };
isSelected = function () { this.isSelected = function () {
return true; return true;
}; };
} }
_buildShape(); this._buildShape();
} },
function reformOption(opt) { reformOption : function (opt) {
var _merge = zrUtil.merge; var _merge = zrUtil.merge;
opt = _merge( opt = _merge(
opt || {}, opt || {},
ecConfig.chord this.ecTheme.chord
); );
opt.itemStyle.normal.label.textStyle = _merge( opt.itemStyle.normal.label.textStyle = _merge(
opt.itemStyle.normal.label.textStyle || {}, opt.itemStyle.normal.label.textStyle || {},
ecConfig.textStyle this.ecTheme.textStyle
); );
} }
};
self.init = init;
self.refresh = refresh;
self.reformOption = reformOption;
init(option, component);
}
zrUtil.inherits(Chord, CalculableBase); zrUtil.inherits(Chord, CalculableBase);
zrUtil.inherits(Chord, ComponentBase); zrUtil.inherits(Chord, ComponentBase);
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册