/**
* @class Ext.chart.series.sprite.Scatter
* @extends Ext.chart.series.sprite.Cartesian
*
* Scatter series sprite.
*/
Ext.define('Ext.chart.series.sprite.Scatter', {
alias: 'sprite.scatterSeries',
extend: 'Ext.chart.series.sprite.Cartesian',
renderClipped: function(surface, ctx, dataClipRect, surfaceClipRect) {
if (this.cleanRedraw) {
return;
}
// eslint-disable-next-line vars-on-top
var me = this,
attr = me.attr,
dataX = attr.dataX,
dataY = attr.dataY,
labels = attr.labels,
series = me.getSeries(),
isDrawLabels = labels && me.getMarker('labels'),
surfaceMatrix = me.surfaceMatrix,
matrix = me.attr.matrix,
xx = matrix.getXX(),
yy = matrix.getYY(),
dx = matrix.getDX(),
dy = matrix.getDY(),
markerCfg = {},
changes, params,
xScalingDirection = surface.getInherited().rtl && !attr.flipXY ? -1 : 1,
left, right, top, bottom,
x, y, i;
if (attr.flipXY) {
left = surfaceClipRect[1] - xx * xScalingDirection;
right = surfaceClipRect[1] + surfaceClipRect[3] + xx * xScalingDirection;
top = surfaceClipRect[0] - yy;
bottom = surfaceClipRect[0] + surfaceClipRect[2] + yy;
}
else {
left = surfaceClipRect[0] - xx * xScalingDirection;
right = surfaceClipRect[0] + surfaceClipRect[2] + xx * xScalingDirection;
top = surfaceClipRect[1] - yy;
bottom = surfaceClipRect[1] + surfaceClipRect[3] + yy;
}
for (i = 0; i < dataX.length; i++) {
x = dataX[i];
y = dataY[i];
x = x * xx + dx;
y = y * yy + dy;
if (left <= x && x <= right && top <= y && y <= bottom) {
if (attr.renderer) {
markerCfg = {
type: 'markers',
translationX: surfaceMatrix.x(x, y),
translationY: surfaceMatrix.y(x, y)
};
params = [me, markerCfg, { store: me.getStore() }, i];
changes = Ext.callback(attr.renderer, null, params, 0, series);
markerCfg = Ext.apply(markerCfg, changes);
}
else {
markerCfg.translationX = surfaceMatrix.x(x, y);
markerCfg.translationY = surfaceMatrix.y(x, y);
}
me.putMarker('markers', markerCfg, i, !attr.renderer);
if (isDrawLabels && labels[i]) {
me.drawLabel(labels[i], x, y, i, surfaceClipRect);
}
}
}
},
drawLabel: function(text, dataX, dataY, labelId, rect) {
var me = this,
attr = me.attr,
label = me.getMarker('labels'),
labelTpl = label.getTemplate(),
labelCfg = me.labelCfg || (me.labelCfg = {}),
surfaceMatrix = me.surfaceMatrix,
labelX, labelY,
labelOverflowPadding = attr.labelOverflowPadding,
flipXY = attr.flipXY,
halfHeight, labelBox,
changes, params;
labelCfg.text = text;
labelBox = me.getMarkerBBox('labels', labelId, true);
if (!labelBox) {
me.putMarker('labels', labelCfg, labelId);
labelBox = me.getMarkerBBox('labels', labelId, true);
}
if (flipXY) {
labelCfg.rotationRads = Math.PI * 0.5;
}
else {
labelCfg.rotationRads = 0;
}
halfHeight = labelBox.height / 2;
labelX = dataX;
switch (labelTpl.attr.display) {
case 'under':
labelY = dataY - halfHeight - labelOverflowPadding;
break;
case 'rotate':
labelX += labelOverflowPadding;
labelY = dataY - labelOverflowPadding;
labelCfg.rotationRads = -Math.PI / 4;
break;
default: // 'over'
labelY = dataY + halfHeight + labelOverflowPadding;
}
labelCfg.x = surfaceMatrix.x(labelX, labelY);
labelCfg.y = surfaceMatrix.y(labelX, labelY);
if (labelTpl.attr.renderer) {
params = [text, label, labelCfg, { store: me.getStore() }, labelId];
changes = Ext.callback(labelTpl.attr.renderer, null, params, 0, me.getSeries());
if (typeof changes === 'string') {
labelCfg.text = changes;
}
else {
Ext.apply(labelCfg, changes);
}
}
me.putMarker('labels', labelCfg, labelId);
}
});