svghmi/widget_xygraph.ysl2
author Edouard Tisserant <edouard.tisserant@gmail.com>
Thu, 04 Apr 2024 17:31:49 +0200
changeset 3926 a6ec38dcbfb5
parent 3691 9289fdda0222
permissions -rw-r--r--
Modbus: add CI test + test project
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     1
// widget_xygraph.ysl2
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     2
widget_desc("XYGraph") {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     3
    longdesc
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     4
    ||
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     5
    XYGraph draws a cartesian trend graph re-using styles given for axis,
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     6
    grid/marks, legends and curves.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     7
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     8
    Elements labeled "x_axis" and "y_axis" are svg:groups containg:
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
     9
     - "axis_label" svg:text gives style an alignment for axis labels.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    10
     - "interval_major_mark" and "interval_minor_mark" are svg elements to be
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    11
       duplicated along axis line to form intervals marks.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    12
     - "axis_line"  svg:path is the axis line. Paths must be intersect and their
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    13
       bounding box is the chart wall.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    14
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    15
    Elements labeled "curve_0", "curve_1", ... are paths whose styles are used
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    16
    to draw curves corresponding to data from variables passed as HMI tree paths.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    17
    "curve_0" is mandatory. HMI variables outnumbering given curves are ignored.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    18
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    19
    ||
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    20
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    21
    shortdesc > Cartesian trend graph showing values of given variables over time
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    22
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    23
    path name="value" count="1+" accepts="HMI_INT,HMI_REAL" > value
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    24
3505
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    25
    arg name="xrange" accepts="int,time" > X axis range expressed either in samples or duration.
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    26
    arg name="xformat" count="optional" accepts="string" > format string for X label
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    27
    arg name="yformat" count="optional" accepts="string" > format string for Y label
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    28
}
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    29
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    30
widget_class("XYGraph") {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    31
    ||
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    32
        frequency = 1;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    33
        init() {
3505
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    34
            let x_duration_s;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    35
            [x_duration_s,
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    36
             this.x_format, this.y_format] = this.args;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    37
3505
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    38
            let timeunit = x_duration_s.slice(-1);
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    39
            let factor = {
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    40
                "s":1,
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    41
                "m":60,
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    42
                "h":3600,
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    43
                "d":86400}[timeunit];
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    44
            if(factor == undefined){
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    45
                this.max_data_length = Number(x_duration_s);
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    46
                this.x_duration = undefined;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    47
            }else{
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    48
                let duration = factor*Number(x_duration_s.slice(0,-1));
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    49
                this.max_data_length = undefined;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    50
                this.x_duration = duration*1000;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    51
            }
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    52
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
    53
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    54
            // Min and Max given with paths are meant to describe visible range,
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    55
            // not to clip data.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    56
            this.clip = false;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    57
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
    58
            let y_min = Infinity, y_max = -Infinity;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    59
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    60
            // Compute visible Y range by merging fixed curves Y ranges
3691
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    61
            for(let varopts of this.variables_options){
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    62
                let minmax = varopts.minmax 
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    63
                if(minmax){
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    64
                    let [min,max] = minmax;
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    65
                    if(min < y_min)
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    66
                        y_min = min;
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    67
                    if(max > y_max)
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    68
                        y_max = max;
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    69
                }
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    70
            }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    71
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
    72
            if(y_min !== Infinity && y_max !== -Infinity){
3691
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    73
                this.fixed_y_range = true;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    74
            } else {
3691
9289fdda0222 SVGHMI: fix XY graph init (consequence of earlier change) + reindent
Edouard Tisserant
parents: 3509
diff changeset
    75
                this.fixed_y_range = false;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    76
            }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    77
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    78
            this.ymin = y_min;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    79
            this.ymax = y_max;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    80
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    81
            this.curves = [];
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    82
            this.init_specific();
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    83
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    84
            this.reference = new ReferenceFrame(
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
    85
                [[this.x_interval_minor_mark_elt, this.x_interval_major_mark_elt],
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
    86
                 [this.y_interval_minor_mark_elt, this.y_interval_major_mark_elt]],
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
    87
                [this.x_axis_label_elt, this.y_axis_label_elt],
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
    88
                [this.x_axis_line_elt, this.y_axis_line_elt],
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    89
                [this.x_format, this.y_format]);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
    90
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    91
            let max_stroke_width = 0;
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    92
            for(let curve of this.curves){
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    93
                if(curve.style.strokeWidth > max_stroke_width){
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    94
                    max_stroke_width = curve.style.strokeWidth;
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    95
                }
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    96
            }
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    97
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    98
            this.Margins=this.reference.getLengths().map(length => max_stroke_width/length);
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
    99
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   100
            // create <clipPath> path and attach it to widget
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   101
            let clipPath = document.createElementNS(xmlns,"clipPath");
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   102
            let clipPathPath = document.createElementNS(xmlns,"path");
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   103
            let clipPathPathDattr = document.createAttribute("d");
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   104
            clipPathPathDattr.value = this.reference.getClipPathPathDattr();
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   105
            clipPathPath.setAttributeNode(clipPathPathDattr);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   106
            clipPath.appendChild(clipPathPath);
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   107
            clipPath.id = randomId();
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   108
            this.element.appendChild(clipPath);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   109
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   110
            // assign created clipPath to clip-path property of curves
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   111
            for(let curve of this.curves){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   112
                curve.setAttribute("clip-path", "url(#" + clipPath.id + ")");
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   113
            }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   114
3509
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   115
            this.curves_data = [];
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   116
        }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   117
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   118
        dispatch(value,oldval, index) {
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   119
            // TODO: get PLC time instead of browser time
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   120
            let time = Date.now();
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   121
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   122
            // naive local buffer impl. 
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   123
            // data is updated only when graph is visible
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   124
            // TODO: replace with separate recording
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   125
3509
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   126
            if(this.curves_data[index] === undefined){
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   127
                this.curves_data[index] = [];
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   128
            }
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   129
            this.curves_data[index].push([time, value]);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   130
            let data_length = this.curves_data[index].length;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   131
            let ymin_damaged = false;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   132
            let ymax_damaged = false;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   133
            let overflow;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   134
3505
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   135
            if(this.max_data_length == undefined){
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   136
                let peremption = time - this.x_duration;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   137
                let oldest = this.curves_data[index][0][0]
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   138
                this.xmin = peremption;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   139
                if(oldest < peremption){
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   140
                    // remove first item
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   141
                    overflow = this.curves_data[index].shift()[1];
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   142
                    data_length = data_length - 1;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   143
                }
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   144
            } else {
3505
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   145
                if(data_length > this.max_data_length){
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   146
                    // remove first item
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   147
                    [this.xmin, overflow] = this.curves_data[index].shift();
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   148
                    data_length = data_length - 1;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   149
                } else {
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   150
                    if(this.xmin == undefined){
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   151
                        this.xmin = time;
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   152
                    }
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   153
                }
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   154
            }
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   155
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   156
            this.xmax = time;
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   157
            let Xrange = this.xmax - this.xmin;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   158
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   159
            if(!this.fixed_y_range){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   160
                ymin_damaged = overflow <= this.ymin;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   161
                ymax_damaged = overflow >= this.ymax;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   162
                if(value > this.ymax){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   163
                    ymax_damaged = false;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   164
                    this.ymax = value;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   165
                }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   166
                if(value < this.ymin){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   167
                    ymin_damaged = false;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   168
                    this.ymin = value;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   169
                }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   170
            }
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   171
            let Yrange = this.ymax - this.ymin;
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   172
3505
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   173
            // apply margin by moving min and max to enlarge range
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   174
            let [xMargin,yMargin] = zip(this.Margins, [Xrange, Yrange]).map(([m,l]) => m*l);
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   175
            [[this.dxmin, this.dxmax],[this.dymin,this.dymax]] =
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   176
                [[this.xmin-xMargin, this.xmax+xMargin],
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   177
                 [this.ymin-yMargin, this.ymax+yMargin]];
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   178
            Xrange += 2*xMargin;
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   179
            Yrange += 2*yMargin;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   180
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   181
            // recompute curves "d" attribute
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   182
            // FIXME: use SVG getPathData and setPathData when available.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   183
            //        https://svgwg.org/specs/paths/#InterfaceSVGPathData
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   184
            //        https://github.com/jarek-foksa/path-data-polyfill
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   185
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   186
            let [base_point, xvect, yvect] = this.reference.getBaseRef();
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   187
            this.curves_d_attr =
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   188
                zip(this.curves_data, this.curves).map(([data,curve]) => {
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   189
                    let new_d = data.map(([x,y], i) => {
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   190
                        // compute curve point from data, ranges, and base_ref
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   191
                        let xv = vectorscale(xvect, (x - this.dxmin) / Xrange);
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   192
                        let yv = vectorscale(yvect, (y - this.dymin) / Yrange);
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   193
                        let px = base_point.x + xv.x + yv.x;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   194
                        let py = base_point.y + xv.y + yv.y;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   195
                        if(!this.fixed_y_range){
3505
a27b5862e363 SVGHMI: Add support for fixed X range (duration) on XY garph.
Edouard Tisserant
parents: 3490
diff changeset
   196
                            // update min and max from curve data if needed
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   197
                            if(ymin_damaged && y < this.ymin) this.ymin = y;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   198
                            if(ymax_damaged && y > this.ymax) this.ymax = y;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   199
                        }
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   200
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   201
                        return " " + px + "," + py;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   202
                    });
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   203
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   204
                    new_d.unshift("M ");
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   205
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   206
                    return new_d.join('');
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   207
                });
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   208
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   209
            // computed curves "d" attr is applied to svg curve during animate();
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   210
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   211
            this.request_animate();
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   212
        }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   213
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   214
        animate(){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   215
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   216
            // move elements only if enough data
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   217
            if(this.curves_data.some(data => data.length > 1)){
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   218
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   219
                // move marks and update labels
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   220
                this.reference.applyRanges([[this.dxmin, this.dxmax],
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   221
                                            [this.dymin, this.dymax]]);
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   222
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   223
                // apply computed curves "d" attributes
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   224
                for(let [curve, d_attr] of zip(this.curves, this.curves_d_attr)){
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   225
                    curve.setAttribute("d", d_attr);
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   226
                }
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   227
            }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   228
        }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   229
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   230
    ||
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   231
}
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   232
3509
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   233
def "func:check_curves_label_consistency" {
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   234
    param "curve_elts";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   235
    param "number_to_check";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   236
    const "res" choose {
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   237
        when "$curve_elts[@inkscape:label = concat('curve_', string($number_to_check))]"{
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   238
            if "$number_to_check > 0"{
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   239
                value "func:check_curves_label_consistency($curve_elts, $number_to_check - 1)";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   240
            }
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   241
        }
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   242
        otherwise {
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   243
            value "concat('missing curve_', string($number_to_check))";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   244
        }
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   245
    }
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   246
    result "$res";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   247
}
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   248
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   249
widget_defs("XYGraph") {
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   250
    labels("/x_interval_minor_mark /x_axis_line /x_interval_major_mark /x_axis_label");
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   251
    labels("/y_interval_minor_mark /y_axis_line /y_interval_major_mark /y_axis_label");
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   252
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   253
    |     init_specific() {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   254
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   255
    // collect all curve_n labelled children
3509
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   256
    const "curves","$hmi_element/*[regexp:test(@inkscape:label,'^curve_[0-9]+$')]";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   257
    const "curves_error", "func:check_curves_label_consistency($curves,count($curves)-1)";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   258
    if "string-length($curves_error)"
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   259
        error > XYGraph id="«@id»", label="«@inkscape:label»" : «$curves_error»
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   260
    foreach "$curves" {
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   261
        const "label","@inkscape:label";
3509
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   262
        const "_id","@id";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   263
        const "curve_num", "substring(@inkscape:label, 7)";
b5ca17732b1e SVGHMI: XY graph build produces error message if provided curve_N are not consistent.
Edouard Tisserant
parents: 3505
diff changeset
   264
    |         this.curves[«$curve_num»] = id("«@id»"); /* «@inkscape:label» */
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   265
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   266
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   267
    |     }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   268
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   269
}
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   270
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   271
emit "declarations:XYGraph"
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   272
||
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   273
function lineFromPath(path_elt) {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   274
    let start = path_elt.getPointAtLength(0);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   275
    let end = path_elt.getPointAtLength(path_elt.getTotalLength());
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   276
    return [start, new DOMPoint(end.x - start.x , end.y - start.y)];
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   277
};
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   278
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   279
function vector(p1, p2) {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   280
    return new DOMPoint(p2.x - p1.x , p2.y - p1.y);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   281
};
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   282
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   283
function vectorscale(p1, p2) {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   284
    return new DOMPoint(p2 * p1.x , p2 * p1.y);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   285
};
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   286
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   287
function vectorLength(p1) {
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   288
    return Math.sqrt(p1.x*p1.x + p1.y*p1.y);
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   289
};
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   290
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   291
function randomId(){
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   292
    return Date.now().toString(36) + Math.random().toString(36).substr(2);
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   293
}
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   294
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   295
function move_elements_to_group(elements) {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   296
    let newgroup = document.createElementNS(xmlns,"g");
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   297
    newgroup.id = randomId();
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   298
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   299
    for(let element of elements){
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   300
        let parent = element.parentElement;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   301
        if(parent !== null)
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   302
            parent.removeChild(element);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   303
        newgroup.appendChild(element);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   304
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   305
    return newgroup;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   306
}
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   307
function getLinesIntesection(l1, l2) {
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   308
    let [l1start, l1vect] = l1;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   309
    let [l2start, l2vect] = l2;
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   310
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   311
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   312
    /*
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   313
    Compute intersection of two lines
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   314
    =================================
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   315
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   316
                          ^ l2vect
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   317
                         /
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   318
                        /
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   319
                       /
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   320
    l1start ----------X--------------> l1vect
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   321
                     / intersection
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   322
                    /
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   323
                   /
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   324
                   l2start
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   325
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   326
	*/
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   327
    let [x1, y1, x3, y3] = [l1start.x, l1start.y, l2start.x, l2start.y];
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   328
	let [x2, y2, x4, y4] = [x1+l1vect.x, y1+l1vect.y, x3+l2vect.x, y3+l2vect.y];
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   329
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   330
	// line intercept math by Paul Bourke http://paulbourke.net/geometry/pointlineplane/
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   331
	// Determine the intersection point of two line segments
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   332
	// Return FALSE if the lines don't intersect
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   333
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   334
    // Check if none of the lines are of length 0
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   335
    if ((x1 === x2 && y1 === y2) || (x3 === x4 && y3 === y4)) {
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   336
        return false
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   337
    }
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   338
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   339
    denominator = ((y4 - y3) * (x2 - x1) - (x4 - x3) * (y2 - y1))
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   340
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   341
    // Lines are parallel
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   342
    if (denominator === 0) {
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   343
        return false
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   344
    }
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   345
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   346
    let ua = ((x4 - x3) * (y1 - y3) - (y4 - y3) * (x1 - x3)) / denominator
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   347
    let ub = ((x2 - x1) * (y1 - y3) - (y2 - y1) * (x1 - x3)) / denominator
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   348
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   349
    // Return a object with the x and y coordinates of the intersection
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   350
    let x = x1 + ua * (x2 - x1)
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   351
    let y = y1 + ua * (y2 - y1)
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   352
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   353
    return new DOMPoint(x,y);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   354
};
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   355
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   356
class ReferenceFrame {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   357
    constructor(
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   358
        // [[Xminor,Xmajor], [Yminor,Ymajor]]
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   359
        marks,
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   360
        // [Xlabel, Ylabel]
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   361
        labels,
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   362
        // [Xline, Yline]
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   363
        lines,
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   364
        // [Xformat, Yformat] printf-like formating strings
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   365
        formats
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   366
    ){
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   367
        this.axes = zip(labels,marks,lines,formats).map(args => new Axis(...args));
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   368
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   369
        let [lx,ly] = this.axes.map(axis => axis.line);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   370
        let [[xstart, xvect], [ystart, yvect]] = [lx,ly];
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   371
        let base_point = this.getBasePoint();
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   372
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   373
        // setup clipping for curves
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   374
        this.clipPathPathDattr =
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   375
            "m " + base_point.x + "," + base_point.y + " "
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   376
                 + xvect.x + "," + xvect.y + " "
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   377
                 + yvect.x + "," + yvect.y + " "
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   378
                 + -xvect.x + "," + -xvect.y + " "
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   379
                 + -yvect.x + "," + -yvect.y + " z";
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   380
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   381
        this.base_ref = [base_point, xvect, yvect];
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   382
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   383
        this.lengths = [xvect,yvect].map(v => vectorLength(v));
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   384
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   385
        for(let axis of this.axes){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   386
            axis.setBasePoint(base_point);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   387
        }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   388
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   389
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   390
    getLengths(){
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   391
        return this.lengths;
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   392
    }
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   393
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   394
	getBaseRef(){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   395
        return this.base_ref;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   396
	}
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   397
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   398
    getClipPathPathDattr(){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   399
        return this.clipPathPathDattr;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   400
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   401
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   402
    applyRanges(ranges){
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   403
        let origin_moves = zip(ranges,this.axes).map(([range,axis]) => axis.applyRange(...range));
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   404
		zip(origin_moves.reverse(),this.axes).forEach(([vect,axis]) => axis.moveOrigin(vect));
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   405
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   406
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   407
    getBasePoint() {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   408
        let [[xstart, xvect], [ystart, yvect]] = this.axes.map(axis => axis.line);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   409
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   410
        /*
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   411
        Compute graph clipping region base point
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   412
        ========================================
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   413
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   414
        Clipping region is a parallelogram containing axes lines,
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   415
        and whose sides are parallel to axes line respectively.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   416
        Given axes lines are not starting at the same point, hereafter is
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   417
        calculus of parallelogram base point.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   418
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   419
                              ^ given Y axis (yvect)
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   420
                   /         /
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   421
                  /         /
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   422
                 /         /
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   423
         xstart *---------*--------------> given X axis (xvect)
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   424
               /         /origin
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   425
              /         /
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   426
             *---------*--------------
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   427
        base_point   ystart
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   428
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   429
        */
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   430
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   431
        let base_point = getLinesIntesection([xstart,yvect],[ystart,xvect]);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   432
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   433
        return base_point;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   434
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   435
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   436
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   437
}
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   438
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   439
class Axis {
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   440
    constructor(label, marks, line, format){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   441
        this.lineElement = line;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   442
        this.line = lineFromPath(line);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   443
        this.format = format;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   444
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   445
        this.label = label;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   446
        this.marks = marks;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   447
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   448
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   449
        // add transforms for elements sliding along the axis line
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   450
        for(let [elementname,element] of zip(["minor", "major", "label"],[...marks,label])){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   451
            for(let name of ["base","slide"]){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   452
                let transform = svg_root.createSVGTransform();
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   453
                element.transform.baseVal.insertItemBefore(transform,0);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   454
                this[elementname+"_"+name+"_transform"]=transform;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   455
            };
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   456
        };
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   457
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   458
        // group marks an labels together
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   459
        let parent = line.parentElement;
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   460
        this.marks_group = move_elements_to_group(marks);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   461
        this.marks_and_label_group = move_elements_to_group([this.marks_group, label]);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   462
        this.group = move_elements_to_group([this.marks_and_label_group,line]);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   463
        parent.appendChild(this.group);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   464
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   465
        // Add transforms to group
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   466
        for(let name of ["base","origin"]){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   467
            let transform = svg_root.createSVGTransform();
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   468
            this.group.transform.baseVal.appendItem(transform);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   469
            this[name+"_transform"]=transform;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   470
        };
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   471
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   472
        this.marks_and_label_group_transform = svg_root.createSVGTransform();
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   473
        this.marks_and_label_group.transform.baseVal.appendItem(this.marks_and_label_group_transform);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   474
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   475
        this.duplicates = [];
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   476
        this.last_duplicate_index = 0;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   477
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   478
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   479
    setBasePoint(base_point){
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   480
        // move Axis to base point
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   481
        let [start, _vect] = this.line;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   482
        let v = vector(start, base_point);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   483
        this.base_transform.setTranslate(v.x, v.y);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   484
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   485
        // Move marks and label to base point.
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   486
        // _|_______          _|________
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   487
        //  |  '  |     ==>    '
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   488
        //  |     0            0
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   489
        //  |                  |
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   490
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   491
        for(let [markname,mark] of zip(["minor", "major"],this.marks)){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   492
            let pos = vector(
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   493
                // Marks are expected to be paths
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   494
                // paths are expected to be lines
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   495
                // intersection with axis line is taken 
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   496
                // as reference for mark position
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   497
                getLinesIntesection(
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   498
                    this.line, lineFromPath(mark)),base_point);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   499
            this[markname+"_base_transform"].setTranslate(pos.x - v.x, pos.y - v.y);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   500
            if(markname == "major"){ // label follow major mark
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   501
                this.label_base_transform.setTranslate(pos.x - v.x, pos.y - v.y);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   502
            }
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   503
        }
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   504
    }
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   505
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   506
	moveOrigin(vect){
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   507
		this.origin_transform.setTranslate(vect.x, vect.y);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   508
	}
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   509
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   510
    applyRange(min, max){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   511
        let range = max - min;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   512
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   513
        // compute how many units for a mark
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   514
        //
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   515
        // - Units are expected to be an order of magnitude smaller than range,
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   516
        //   so that marks are not too dense and also not too sparse.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   517
        //   Order of magnitude of range is log10(range)
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   518
        //
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   519
        // - Units are necessarily power of ten, otherwise it is complicated to
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   520
        //   fill the text in labels...
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   521
        //   Unit is pow(10, integer_number )
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   522
        //
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   523
        // - To transform order of magnitude to an integer, floor() is used.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   524
        //   This results in a count of mark fluctuating in between 10 and 100.
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   525
        //
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   526
        // - To spare resources result is better in between 3 and 30,
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   527
        //   and log10(3) is substracted to order of magnitude to obtain this
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   528
        let unit = Math.pow(10, Math.floor(Math.log10(range)-Math.log10(3)));
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   529
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   530
        // TODO: for time values (ms), units may be :
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   531
        //       1       -> ms
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   532
        //       10      -> s/100
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   533
        //       100     -> s/10
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   534
        //       1000    -> s
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   535
        //       60000   -> min
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   536
        //       3600000 -> hour
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   537
        //       ...
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   538
        //
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   539
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   540
        // Compute position of origin along axis [0...range]
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   541
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   542
        // min < 0, max > 0, offset = -min
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   543
        // _____________|________________
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   544
        // ... -3 -2 -1 |0  1  2  3  4 ...
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   545
        // <--offset---> ^
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   546
        //               |_original
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   547
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   548
        // min > 0, max > 0, offset = 0
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   549
        // |________________
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   550
        // |6  7  8  9  10...
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   551
        //  ^
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   552
        //  |_original
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   553
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   554
        // min < 0, max < 0, offset = max-min (range)
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   555
        // _____________|_
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   556
        // ... -5 -4 -3 |-2
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   557
        // <--offset---> ^
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   558
        //               |_original
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   559
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   560
        let offset = (max>=0 && min>=0) ? 0 : (
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   561
                     (max<0 && min<0)   ? range : -min);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   562
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   563
        // compute unit vector
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   564
        let [_start, vect] = this.line;
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   565
        let unit_vect = vectorscale(vect, 1/range);
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   566
        let [mark_min, mark_max, mark_offset] = [min,max,offset].map(val => Math.round(val/unit));
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   567
        let mark_count = mark_max-mark_min;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   568
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   569
        // apply unit vector to marks and label
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   570
        // offset is a representing position of an 
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   571
        // axis along the opposit axis line, expressed in major marks units
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   572
        // unit_vect is unit vector
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   573
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   574
        //              ^
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   575
        //              | unit_vect
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   576
        //              |<--->
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   577
        //     _________|__________>
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   578
        //     ^  |  '  |  '  |  '
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   579
        //     |yoffset |     1 
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   580
        //     |        |
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   581
        //     v xoffset|
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   582
        //     X<------>|
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   583
        // base_point
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   584
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   585
        // move major marks and label to first positive mark position
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   586
        // let v = vectorscale(unit_vect, unit);
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   587
        // this.label_slide_transform.setTranslate(v.x, v.y);
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   588
        // this.major_slide_transform.setTranslate(v.x, v.y);
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   589
        // move minor mark to first half positive mark position
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   590
        let v = vectorscale(unit_vect, unit/2);
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   591
        this.minor_slide_transform.setTranslate(v.x, v.y);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   592
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   593
        // duplicate marks and labels as needed
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   594
        let current_mark_count = this.duplicates.length;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   595
        for(let i = current_mark_count; i <= mark_count; i++){
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   596
            // cloneNode() label and add a svg:use of marks in a new group
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   597
            let newgroup = document.createElementNS(xmlns,"g");
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   598
            let transform = svg_root.createSVGTransform();
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   599
            let newlabel = this.label.cloneNode(true);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   600
            let newuse = document.createElementNS(xmlns,"use");
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   601
            let newuseAttr = document.createAttribute("href");
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   602
            newuseAttr.value = "#"+this.marks_group.id;
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   603
            newuse.setAttributeNode(newuseAttr);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   604
            newgroup.transform.baseVal.appendItem(transform);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   605
            newgroup.appendChild(newlabel);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   606
            newgroup.appendChild(newuse);
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   607
            this.duplicates.push([transform,newgroup]);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   608
        }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   609
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   610
        // move marks and labels, set labels
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   611
        // 
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   612
        // min > 0, max > 0, offset = 0
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   613
        //         ^
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   614
        //         |________>
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   615
        //        '| |  '  |
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   616
        //         | 6     7
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   617
        //         X
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   618
        //     base_point
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   619
        //
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   620
        // min < 0, max > 0, offset = -min
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   621
        //              ^
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   622
        //     _________|__________>
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   623
        //     '  |  '  |  '  |  '
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   624
        //       -1     |     1 
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   625
        //       offset |
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   626
        //     X<------>|
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   627
        // base_point
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   628
        //
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   629
        // min < 0, max < 0, offset = range
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   630
        //                 ^
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   631
        //     ____________|    
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   632
        //      '  |  '  | |'
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   633
        //        -5    -4 |
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   634
        //         offset  |
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   635
        //     X<--------->|
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   636
        // base_point
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   637
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   638
        let duplicate_index = 0;
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   639
        for(let mark_index = 0; mark_index <= mark_count; mark_index++){
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   640
            let val = (mark_min + mark_index) * unit;
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   641
            let vec = vectorscale(unit_vect, val - min);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   642
            let text = this.format ? sprintf(this.format, val) : val.toString();
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   643
            if(mark_index == mark_offset){
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   644
                // apply offset to original marks and label groups
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   645
                this.marks_and_label_group_transform.setTranslate(vec.x, vec.y);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   646
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   647
                // update original label text
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   648
                this.label.getElementsByTagName("tspan")[0].textContent = text;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   649
            } else {
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   650
                let [transform,element] = this.duplicates[duplicate_index++];
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   651
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   652
                // apply unit vector*N to marks and label groups
3484
32eaba9cf30e SVGHMI: many fixes on xy trend graph. WIP.
Edouard Tisserant
parents: 3474
diff changeset
   653
                transform.setTranslate(vec.x, vec.y);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   654
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   655
                // update label text
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   656
                element.getElementsByTagName("tspan")[0].textContent = text;
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   657
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   658
                // Attach to group if not already
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   659
                if(element.parentElement == null){
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   660
                    this.group.appendChild(element);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   661
                }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   662
            }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   663
        }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   664
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   665
        let save_duplicate_index = duplicate_index;
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   666
        // dettach marks and label from group if not anymore visible
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   667
        for(;duplicate_index < this.last_duplicate_index; duplicate_index++){
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   668
            let [transform,element] = this.duplicates[duplicate_index];
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   669
            this.group.removeChild(element);
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   670
        }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   671
3490
4f252e8d6759 SVGHMI: more fixes for XY graph + add XY graph test.
Edouard Tisserant
parents: 3488
diff changeset
   672
        this.last_duplicate_index = save_duplicate_index;
3488
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   673
6ef4ffcf9761 SVGHMI: multiple fixes in XY graph widget. WIP.
Edouard Tisserant
parents: 3484
diff changeset
   674
		return vectorscale(unit_vect, offset);
3470
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   675
    }
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   676
}
b36754171535 SVGHMI: Add premature implementation of XY chart.
Edouard Tisserant
parents:
diff changeset
   677
||