Jak vykreslit winapi Arc pomocí javascriptu do SVG?

[Opoidní Lopaťák]

Zdarec programátoři,
potřeboval bych vykreslit winapi arc pomocí funkce javascriptu do SVG. Mezitím co Rectangle i Ellipse tam jsou přímo, Arc tak snadný není. Určitě to ale nějak půjde přes path, no ale nevím jak. V ideálním případě bych potřeboval naimplementovat v js funkci se stejnými parametry jako má ta ve Windows tak aby fungovala stejně. Zatím něco s path mám, ale oblouček se kreslí blbě, protože path chce odkud kam to jde a ve win je zas ten bounding rectangle.

No a tak se ptám jestli někdo víte jak na to, a jestli byste mi s tím tady pomohli .

[Reklama]

[Ivan Nový]

http://stackoverflow.com/questions/5736398/how-to-calculate-the-svg-path-for-an-arc-of-a-circle

[Opoidní Lopaťák]

Signatura té funkce tam neodpovídá tomu co je ve winapi, prostě nevím jak to přepočíst aby to sedělo do toho bounding rectu...

[Mirek Prýmek]

prostě nevím jak to přepočíst aby to sedělo do toho bounding rectu...

Jakože neumíš spočítat souřadnice těžiště obdélníka? Nebo?

[Opoidní Lopaťák]

Tak pokus se nezdařil, nikdo to nevyřešil... nejde o to že to neumím vypočítat, jde o to že to potřebuji do práce ale nechce se mi jebat se vzorečkama někde na papíře protože "context switching", namísto abych "lepil velkou mozajku" tak se najednou musím zabývat jedním dílkem. Doufal jsem že to zadám do fóra přes víkend a nějaký znuděný maník se najde a já v pondělí sklidím ovoce bez práce

Ach jo, budu muset počítat, už ani neznám polární souřadnice dělal jsem to před lety na gymplu naposled...

[Reklama]

[neruda]

Tak pokus se nezdařil, nikdo to nevyřešil... nejde o to že to neumím vypočítat, jde o to že to potřebuji do práce ale nechce se mi jebat se vzorečkama někde na papíře protože "context switching", namísto abych "lepil velkou mozajku" tak se najednou musím zabývat jedním dílkem. Doufal jsem že to zadám do fóra přes víkend a nějaký znuděný maník se najde a já v pondělí sklidím ovoce bez práce

Ach jo, budu muset počítat, už ani neznám polární souřadnice dělal jsem to před lety na gymplu naposled...

ach jo, budes si muset namahat mozek, misto toho aby to nejaka lopata poslala reseni a ty ses mohl zabyvat "lepenim velke mozaiky" ...

[ehmmm]

Sorry za vulgarismy, ale ty vole, to je fakt vysoka matematika. 

[peter]

Tunajší brigádnici sú dnes bez dozoru že tu spamujú takýmito blbosťami? Dúfam, že sa im zspoň zobrazuje reklama.

[Opoidní Lopaťák]

Fajn, zabralo to půl dne. A pak že je to triviální. A to to ještě nemám pořádně otestované...
https://jsfiddle.net/6jpgvo58/

[Opoidní Lopaťák]

Najdi alespoň 3 chyby či ošklivosti v níže uvedeném zdrojovém kódu:

Kód: [Vybrat]

function TCanvas_Arc(x1,y1, x2,y2, x3,y3, x4,y4) {
  try{
        function dist(x1, y1, x2, y2) {
              var dx = x2 - x1;
              var dy = y2 - y1;
              return Math.sqrt(dx * dx + dy * dy);
          }
         
        var rx = Math.floor(Math.abs((x2 - x1) / 2));
        var ry = Math.floor(Math.abs((y2 - y1) / 2));
         
            var cx = Math.floor((x1 + x2) / 2);
            var cy = Math.floor((y1 + y2) / 2);
         
            var ix1 = x3 - cx;
            var iy1 = y3 - cy;
            var c = (rx * ry) / Math.sqrt(rx * rx * iy1 * iy1 + ry * ry * ix1 * ix1);
                 
            var x1a = cx + c * ix1;
        var y1a = cy + c * iy1;
         
        var x1b = cx - c * ix1;
        var y1b = cy - c * iy1;
 
        var ax1 = x1a;
        var ay1 = y1a;
        if (dist(x1a, y1a, x3, y3) > dist(x1b, y1b, x3, y3)) {
          ax1 = x1b;
          ay1 = y1b;
        }
         
        var ix2 = x4 - cx;
        var iy2 = y4 - cy;
 
        var x2a = cx + c * ix2;
        var y2a = cy + c * iy2;
 
        var x2b = cx - c * ix2;
        var y2b = cy - c * iy2;
 
        var ax2 = x2a;
        var ay2 = y2a;
         
        if (dist(x2a, y2a, x4, y4) > dist(x2b, y2b, x4, y4)) {
          ax2 = x2b;
          ay2 = y2b;
        }
         
        var deg = Math.atan2(ay1 - cy, ax1 - cx) - Math.atan2(ay2 - cy, ax2 - cx);
        if (deg < 0)
          deg += 2 * Math.PI;
         
                var largeArcFlag = deg > Math.PI ? 1 : 0;
        var pathStr = 'M ' + ax1 + ' ' + ay1 + ' ' +
                      'A ' + rx + ' ' + ry + ' 0 ' + largeArcFlag + ' 0 ' + ax2 + ' ' + ay2;
 
           
        var xmlns = "http://www.w3.org/2000/svg";
        var path = document.createElementNS(xmlns, "path");
        path.setAttribute('d', pathStr);       
        path.setAttribute('stroke','black');
        path.setAttribute('fill','transparent');
         
        return path;
  } catch (e) {
    alert(e);
    return null;
  }
}