1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100 | 1×
1×
1×
1×
1×
305×
172×
172×
172×
172×
172×
172×
172×
172×
172×
172×
172×
172×
3477×
3477×
3477×
3477×
1×
3477×
3477×
3477×
3477×
3477×
3477×
3477×
3477×
3477×
3477×
3477×
3477×
2469×
2469×
2469×
42×
42×
42×
42×
42×
42×
42×
42×
42×
42×
42×
42×
882×
5292×
5292×
5292×
882×
4410×
882×
882×
882×
882×
3477×
3477×
3477×
172×
3477×
1×
1×
| define(["require", "exports", "../../smithchart/utils/helper", "../../smithchart/utils/utils"], function (require, exports, helper_1, utils_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Marker = (function () {
function Marker() {
}
Marker.prototype.drawMarker = function (smithchart, seriesindex, groupElement, pointsRegion) {
if (smithchart.series[seriesindex].marker.visible) {
var marker = smithchart.series[seriesindex].marker;
var count = smithchart.series[seriesindex].points.length - 1;
var width = marker.width;
var height = marker.height;
var symbolName = marker.shape;
var gmEle = smithchart.renderer.createGroup({ 'id': smithchart.element.id + '_svg' +
'_series' + seriesindex + '_Marker' });
groupElement.appendChild(gmEle);
var borderWidth = marker.border.width;
var borderColor = marker.border.color;
var opacity = marker.opacity;
var fill = marker.fill ? marker.fill : (smithchart.series[seriesindex].fill ||
smithchart.seriesColors[seriesindex % smithchart.seriesColors.length]);
for (var i = 0; i < count + 1; i++) {
var location_1 = pointsRegion[i]['point'];
var pointIndex = i;
var options = new utils_1.MarkerOptions(smithchart.element.id + '_Series' + seriesindex + '_Points' + pointIndex + '_Marker' + pointIndex, fill, borderColor, borderWidth, opacity);
gmEle.appendChild(this.drawSymbol(symbolName, marker.imageUrl, location_1, new utils_1.SmithchartSize(width, height), options, smithchart));
}
}
};
Marker.prototype.drawSymbol = function (symbolName, url, location, size, options, smithchart) {
var markerEle;
var shape = symbolName.toLowerCase();
var circleOptions;
var pathOptions;
var path;
var border = { color: options['borderColor'], width: options['borderWidth'] };
var opacity = options.opacity;
var startX = location.x;
var startY = location.y;
var radius = Math.sqrt(size.height * size.height + size.width * size.width) / 2;
var eq = 72;
switch (shape) {
case 'circle':
circleOptions = new helper_1.CircleOption(options['id'], options['fill'], border, opacity, location.x, location.y, radius, null);
markerEle = smithchart.renderer.drawCircle(circleOptions);
break;
case 'rectangle':
path = 'M' + ' ' + (startX + (-size.width / 2)) + ' ' + (startY + (-size.height / 2)) +
' ' + 'L' + ' ' + (startX + (size.width / 2)) + ' ' + (startY + (-size.height / 2)) + ' ' +
'L' + ' ' + (startX + (size.width / 2)) + ' ' + (startY + (size.height / 2)) +
' ' + 'L' + ' ' + (startX + (-size.width / 2)) +
' ' + (startY + (size.height / 2)) + ' ' + 'L' + ' ' +
(startX + (-size.width / 2)) + ' ' + (startY + (-size.height / 2)) + 'z';
pathOptions = new helper_1.PathOption(options['id'], options['fill'], border.width, border.color, opacity, '', path);
markerEle = smithchart.renderer.drawPath(pathOptions);
break;
case 'triangle':
path = 'M' + ' ' + (startX + (-size.width / 2)) + ' ' + (startY + (size.height / 2)) + ' ' + 'L' + ' ' + (startX) + ' ' +
(startY + (-size.height / 2)) + ' ' + 'L' + ' ' + (startX + (size.width / 2)) + ' ' +
(startY + (size.height / 2)) + ' ' + 'L' + ' ' +
(startX + (-size.width / 2)) + ' ' + (startY + (size.height / 2)) + 'z';
pathOptions = new helper_1.PathOption(options['id'], options['fill'], border.width, border.color, opacity, '', path);
markerEle = smithchart.renderer.drawPath(pathOptions);
break;
case 'diamond':
path = 'M' + ' ' + (startX + (-size.width / 2)) + ' ' + (startY) + ' ' + 'L' + ' ' +
(startX) + ' ' + (startY + (-size.height / 2)) + ' ' + 'L' + ' ' + (startX + (size.width / 2)) + ' ' +
(startY) + ' ' + 'L' + ' ' + (startX) + ' ' + (startY + (size.height / 2)) + ' ' + 'L' + ' ' +
(startX + (-size.width / 2)) + ' ' + (startY) + 'z';
pathOptions = new helper_1.PathOption(options['id'], options['fill'], border.width, border.color, opacity, '', path);
markerEle = smithchart.renderer.drawPath(pathOptions);
break;
case 'pentagon':
for (var i = 0; i <= 5; i++) {
var xValue = radius * Math.cos((Math.PI / 180) * (i * eq));
var yValue = radius * Math.sin((Math.PI / 180) * (i * eq));
if (i === 0) {
path = 'M' + ' ' + (startX + xValue) + ' ' + (startY + yValue) + ' ';
}
else {
path = path.concat('L' + ' ' + (startX + xValue) + ' ' + (startY + yValue) + ' ');
}
}
path = path.concat('Z');
pathOptions = new helper_1.PathOption(options['id'], options['fill'], border.width, border.color, opacity, '', path);
markerEle = smithchart.renderer.drawPath(pathOptions);
break;
}
markerEle.setAttribute('role', 'img');
markerEle.setAttribute('aria-label', 'x: ' + (location.x) + ', ' + 'y: ' + (location.y));
if ((smithchart.element.id + '_Series0_Points0_Marker0') === (options.id)) {
markerEle.setAttribute('tabindex', '0');
}
return markerEle;
};
return Marker;
}());
exports.Marker = Marker;
});
|