98_SVG.pm: add splines, restore some lost styles.

git-svn-id: https://svn.fhem.de/fhem/trunk@7633 2b470e98-0d58-463d-a4d8-8e2adae1ed80
2025-01-31 06:39:11 +00:00 · 2015-01-19 21:32:18 +00:00 · 2015-01-19 21:32:18 +00:00 · 7659463747
commit 7659463747
parent 9d830526cb
7 changed files with 55 additions and 37 deletions
--- a/fhem/FHEM/98_SVG.pm
+++ b/fhem/FHEM/98_SVG.pm
@ -397,8 +397,10 @@ SVG_PEdit($$$$)
    my $v = $conf{lAxis}[$idx];
    $o .= SVG_sel("axes_${idx}", "left,right", 
                    ($v && $v eq "x1y1") ? "left" : "right");
-    $o .= SVG_sel("type_${idx}", "lines,points,steps,fsteps,histeps,bars",
-                    $conf{lType}[$idx]);
+    $o .= SVG_sel("type_${idx}",
+                "lines,points,steps,fsteps,histeps,bars,".
+                        "cubic,cubicSmooth,quadratic,quadraticSmooth",
+                $conf{lType}[$idx]);
    my $ls = $conf{lStyle}[$idx]; 
    if($ls) {
      $ls =~ s/class=//g;
@ -1627,7 +1629,8 @@ SVG_render($$$$$$$$$;$$)
    my $yp = $y + $h;

    #-- axis if not left or right axis
-    SVG_pO "<polyline points=\"$off3,$y $off3,$yp\" $cll/>" if( ($a ne "x1y1") && ($a ne "x1y2") );
+    SVG_pO "<polyline points=\"$off3,$y $off3,$yp\" $cll/>"
+        if($a ne "x1y1" && $a ne "x1y2");

    #-- tics handling
    my $tic = $htics{$a};
@ -1716,7 +1719,8 @@ SVG_render($$$$$$$$$;$$)

    my ($lx, $ly) = (-1,-1);

-    if($conf{lType}[$idx] eq "points" ) {
+    my $lType = $conf{lType}[$idx];
+    if($lType eq "points" ) {
      foreach my $i (0..int(@{$dxp})-1) {
        my ($x1, $y1) = (int($x+$dxp->[$i]),
                         int($y+$h-($dyp->[$i]-$min)*$hmul));
@ -1727,7 +1731,7 @@ SVG_render($$$$$$$$$;$$)
        SVG_pO "<polyline $attributes $lStyle points=\"$ret\"/>";
      }

-    } elsif($conf{lType}[$idx] eq "steps" || $conf{lType}[$idx] eq "fsteps" ) {
+    } elsif($lType eq "steps" || $lType eq "fsteps" ) {

      $ret .=  sprintf(" %d,%d", $x+$dxp->[0], $y+$h) if($isFill && @{$dxp});
      if(@{$dxp} == 1) {
@ -1740,7 +1744,7 @@ SVG_render($$$$$$$$$;$$)
          my ($x2, $y2) = ($x+$dxp->[$i],   $y+$h-($dyp->[$i]  -$min)*$hmul);
          next if(int($x2) == $lx && int($y1) == $ly);
          $lx = int($x2); $ly = int($y2);
-          if($conf{lType}[$idx] eq "steps") {
+          if($lType eq "steps") {
            $ret .=  sprintf(" %d,%d %d,%d %d,%d", $x1,$y1, $x2,$y1, $x2,$y2);
          } else {
            $ret .=  sprintf(" %d,%d %d,%d %d,%d", $x1,$y1, $x1,$y2, $x2,$y2);
@ -1751,7 +1755,7 @@ SVG_render($$$$$$$$$;$$)

      SVG_pO "<polyline $attributes $lStyle points=\"$ret\"/>";

-    } elsif($conf{lType}[$idx] eq "histeps" ) {
+    } elsif($lType eq "histeps" ) {
      $ret .=  sprintf(" %d,%d", $x+$dxp->[0], $y+$h) if($isFill && @{$dxp});
      if(@{$dxp} == 1) {
          my $y1 = $y+$h-($dyp->[0]-$min)*$hmul;
@ -1770,7 +1774,7 @@ SVG_render($$$$$$$$$;$$)
      $ret .=  sprintf(" %d,%d", $lx, $y+$h) if($isFill && $lx > -1);
      SVG_pO "<polyline $attributes $lStyle points=\"$ret\"/>";

-    } elsif( $conf{lType}[$idx] eq "bars" ) {
+    } elsif( $lType eq "bars" ) {
       if(@{$dxp} == 1) {
          my $y1 = $y+$h-($dyp->[0]-$min)*$hmul;
          $ret .=  sprintf(" %d,%d %d,%d %d,%d %d,%d",
@ -1790,15 +1794,18 @@ SVG_render($$$$$$$$$;$$)

    } else {                            # lines and everything else
      my ($ymin, $ymax) = (99999999, -99999999);
-
+      my %lt =(cubic=>"C",cubicSmooth=>"S",quadratic=>"Q",quadraticSmooth=>"T");
+      my ($x1, $y1);
+      my $lt = ($lt{$lType} ? $lt{$lType} : "L"); # defaults to line
+      my $qs = ($lType eq "quadraticSmooth");
      foreach my $i (0..int(@{$dxp})-1) {
+
        if( !defined($dxp->[$i]) ) { # specials
          if(  $dyp->[$i] =~ m/^;$/ ) { # new line segment after newline
-            SVG_pO "<polyline $attributes $lStyle points=\"$ret\"/>";
+            SVG_pO "<path $attributes $lStyle d=\"$ret\"/>";
            $ret = "";

          } elsif( $dyp->[$i] =~ m/^;c (.*)/ ) {# close polyline ?
-
            $doClose = $1;

          } elsif( $dyp->[$i] =~ m/^;ls (\w+)?/ ) {# line style
@ -1810,15 +1817,14 @@ SVG_render($$$$$$$$$;$$)

          # marker with optional text
          } elsif( $dyp->[$i] =~ m/^;m (\S+)\s(\S+)(\s(\S+)\s(.*))?/ ) {
-            my $x1;
            if( defined($xmin) ) {
              $x1 = int($x+($1-$xmin)*$xmul);
            } else {
              $x1 = ($tmul ? int((SVG_time_to_sec($1)-$fromsec)*$tmul) : $x);
            }
-            my $y1 = int($y+$h-($2-$min)*$hmul);
+            $y1 = int($y+$h-($2-$min)*$hmul);

-            my $ret =  sprintf(" %d,%d %d,%d %d,%d %d,%d %d,%d",
+            my $ret = sprintf("%d,%d %d,%d %d,%d %d,%d %d,%d",
                         $x1-3,$y1, $x1,$y1-3, $x1+3,$y1, $x1,$y1+3, $x1-3,$y1);
            SVG_pO "<polyline $attributes $lStyle points=\"$ret\"/>";

@ -1826,13 +1832,12 @@ SVG_render($$$$$$$$$;$$)
                        "</text>" if( $3 );

          } elsif( $dyp->[$i] =~ m/^;t (\S+)\s(\S+)\s(\S+)\s(.*)/ ) {# text
-            my $x1;
            if( defined($xmin) ) {
              $x1 = int($x+($1-$xmin)*$xmul);
            } else {
              $x1 = ($tmul ? int((SVG_time_to_sec($1)-$fromsec)*$tmul) : $x);
            }
-            my $y1 = int($y+$h-($2-$min)*$hmul);
+            $y1 = int($y+$h-($2-$min)*$hmul);


            SVG_pO "<text x=\"$x1\" y=\"$y1\" $lStyle text-anchor=\"$3\">$4".
@ -1844,24 +1849,30 @@ SVG_render($$$$$$$$$;$$)
          }

          next;
-
        }

-        my ($x1, $y1) = (int($x+$dxp->[$i]),
+        ($x1, $y1) = (int($x+$dxp->[$i]),
                         int($y+$h-($dyp->[$i]-$min)*$hmul));

        next if($x1 == $lx && $y1 == $ly);


        # calc ymin/ymax for points with the same x coordinates
-        if( $x1 == $lx ) {
-          $ymin = $y1 if( $y1 < $ymin );
-          $ymax = $y1 if( $y1 > $ymax );
+        if($x1 == $lx) {
+          $ymin = $y1 if($y1 < $ymin);
+          $ymax = $y1 if($y1 > $ymax);
          $ly = $y1;
          next;
        }

-        $ret .=  sprintf(" %d,%d", $x1, $y+$h) if($i == 0 && $doClose);
+        if($i == 0) {
+          if($doClose) {
+            $ret .= sprintf("M%d,%d L%d,%d $lt", $x1,$y+$h, $x1,$y1);
+          } else {
+            $ret .= sprintf("M%d,%d $lt", $x1,$y1);
+          }
+          next;
+        }

        # plot ymin/ymax range for points with the same x coordinates
        if( $ymin != 99999999 ) {
@ -1874,9 +1885,9 @@ SVG_render($$$$$$$$$;$$)
        $lx = $x1; $ly = $y1;
      }
      #-- insert last point for filled line
-      $ret .=  sprintf(" %d,%d", $lx, $y+$h) if($doClose && $lx > -1);
+      $ret .=  sprintf(" L%d,%d Z", $lx, $y+$h) if($doClose && $lx > -1);

-      SVG_pO "<polyline $attributes $lStyle points=\"$ret\"/>";
+      SVG_pO "<path $attributes $lStyle d=\"$ret\"/>";
    }

  }
--- a/fhem/docs/commandref_frame.html
+++ b/fhem/docs/commandref_frame.html
@ -1580,6 +1580,8 @@ The .gnuplot file consists of 3 parts:
        Specify the line type. Following types are recognized: points,
        steps, fsteps, histeps and lines. Everything unknown will be mapped to
        the type lines.
+        SVG special: cubic, cubicSmooth, quadratic, quadraticSmooth, are mapped
+        to the SVG path types C,S,Q and T respectively.
        </li>
      <li>ls &lt;linestyle&gt;<br>
        The linestyle defaults to l0 for the first line, l1 for the second, and
--- a/fhem/docs/commandref_frame_DE.html
+++ b/fhem/docs/commandref_frame_DE.html
@ -1700,6 +1700,8 @@ Die folgenden lokalen Attribute werden von mehreren Ger&auml;te verwendet:
        spezifiziert die Art der Linie. Folgende Linienarten k&ouml;nnen
        verwendet werden: points, steps, fsteps, histeps and lines. Nicht
        bekannte Linienarten werden als Typ &quot;lines&quot; dargestellt.
+        SVG Spezial: cubic, cubicSmooth, quadratic, quadraticSmooth werden zu
+        den SVG path Typen C,S,Q und T gewandelt.
        </li>

      <li>ls &lt;linestyle&gt;<br>
--- a/fhem/www/pgm2/darksvg_style.css
+++ b/fhem/www/pgm2/darksvg_style.css
@ -6,11 +6,12 @@ text.copy  { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
 text.paste { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}


+path     { stroke:black; fill:none; }
 polyline { stroke:black; fill:none; }
-.border { stroke:black; fill:url(#gr_bg);}
-.vgrid { stroke:gray; stroke-dasharray:2,6;}
-.hgrid { stroke:gray; stroke-dasharray:2,6;}
-.pasted { stroke:black; stroke-dasharray:1,1;}
+.border  { stroke:black; fill:url(#gr_bg);}
+.vgrid   { stroke:gray; stroke-dasharray:2,6;}
+.hgrid   { stroke:gray; stroke-dasharray:2,6;}
+.pasted  { stroke:black; stroke-dasharray:1,1;}

 .l0 { stroke:red;     }  text.l0 { stroke:none; fill:red;     } 
 .l1 { stroke:green;   }  text.l1 { stroke:none; fill:green;   } 
--- a/fhem/www/pgm2/ios6svg_style.css
+++ b/fhem/www/pgm2/ios6svg_style.css
@ -18,11 +18,12 @@ text.legend{ cursor:pointer; }
 text.copy  { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
 text.paste { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}

+path     { stroke:black; fill:none; }
 polyline { stroke:black; fill:none; }
-.border { stroke:black; fill:url(#gr_bg);}
-.vgrid { stroke:gray; stroke-dasharray:2,6;}
-.hgrid { stroke:gray; stroke-dasharray:2,6;}
-.pasted { stroke:black; stroke-dasharray:1,1;}
+.border  { stroke:black; fill:url(#gr_bg);}
+.vgrid   { stroke:gray; stroke-dasharray:2,6;}
+.hgrid   { stroke:gray; stroke-dasharray:2,6;}
+.pasted  { stroke:black; stroke-dasharray:1,1;}

 .l0 { stroke:red;     }  text.l0 { stroke:none; fill:red;     } 
 .l1 { stroke:green;   }  text.l1 { stroke:none; fill:green;   } 
--- a/fhem/www/pgm2/ios7svg_style.css
+++ b/fhem/www/pgm2/ios7svg_style.css
@ -5,6 +5,7 @@ text.legend{ cursor:pointer; }
 text.copy  { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
 text.paste { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}

+path     { stroke:black; fill:none; }
 polyline { stroke:black; fill:none; }
 .border { stroke:black; fill:url(#gr_bg);}
 .vgrid { stroke:gray; stroke-dasharray:2,6;}
--- a/fhem/www/pgm2/svg_style.css
+++ b/fhem/www/pgm2/svg_style.css
@ -1,9 +1,11 @@
+.background { fill:#FFFFE7; }
+
 text       { font-family:Times; font-size:12px; }
 text.title { font-size:16px; }
-text.legend{ cursor:pointer; }
-text.copy  { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
-text.paste { text-decoration:underline; stroke:none; fill:blue; cursor:pointer;}
+text.copy  { text-decoration:underline; stroke:none; fill:blue;    }
+text.paste { text-decoration:underline; stroke:none; fill:blue;    }

+path     { stroke:black; fill:none; }
 polyline { stroke:black; fill:none; }
 .border  { stroke:black; fill:url(#gr_bg); }
 .vgrid   { stroke:gray;  stroke-dasharray:2,6; }
@ -35,5 +37,3 @@ polyline { stroke:black; fill:none; }
 .l1fill_stripe {stroke:green; fill:url(#gr1_stripe);} text.l1fill_stripe {stroke:none; fill:green;}

 .l0fill_gyr {stroke:red; fill:url(#gr0_gyr);} text.l0fill_gyr {stroke:none; fill:red;}
-
-circle#svgmarker { fill:#278727; opacity:0.5; }