Eu lancei o Grafar - uma biblioteca JS para renderização

Abri o grafar - minha biblioteca para renderização. A maior parte do código foi escrita em 2013-2016 para minha tese. Pelos próximos 5 anos, o projeto ficou em cima da mesa - eu não estava muito feliz com a API, havia muitos recursos interessantes que eu poderia adicionar, o trabalho era uma droga e havia mais mil razões para não lançá-lo ainda , você sabe. Afinal, existem tantas pessoas no mundo que são mais espertas do que eu, e com certeza elas vão inventar algo melhor, certo?





Na semana passada me deparei com esse lindo código juntando poeira no github novamente - achei que ainda parece legal e tenho certeza que vai economizar muito tempo para alguém. Portanto, forneci ao projeto uma documentação de classe mundial, atualizei a compilação e iniciei o modo hype.





Para ser honesto, este é o primeiro lançamento público do graphar. Provavelmente, há bugs nele e não posso prometer a estabilidade total da API para sempre. Mesmo assim, tenho certeza de que você deve prestar atenção ao gráfico, e aqui está o motivo:





API simples. Com apenas 10 linhas de código, você construiu a superfície diretamente no seu navegador. A API é voltada para trabalhar com objetos matemáticos - curvas, superfícies, pontos - e usa um modelo de topologia de objeto engenhoso para fazer tudo funcionar conforme o esperado.





. -, , , , — 1 30FPS. WebGL , .





c 3D 2D. ThreeJS, 3D — , . 2D, .





. Grafar — (- MobX). , , .





, , . codesandbox.





— . :





const p = grafar.range(-2, 2, 500).select();
const q = grafar.range(0, 1, 2).select();
      
      



([-2, 2] p, [0, 1] q) , .





(x,y,z):





const xp = grafar.map([p, q], (p, q) => Math.cos(8 * p) * q);
const yp = grafar.map([p, q], (p, q) => Math.sin(8 * p) * q);
      
      



. -, , p q — , . -, xp yp — p q, xp yp .





, — :





const container = document.getElementById("app");
const panel = grafar.panel(container);
grafar.pin([xp, yp, p], panel);
      
      



7 :






, — , grafar. :





. , , . — , .





Se você está interessado na biblioteca, verifique a documentação (até agora apenas em inglês). O código completo da biblioteca está disponível no github . Em ishyus pode reclamar de um bug ou pedir-lhe para participar no desenvolvimento de (eu não ajudo a prevenir).





De qualquer forma, espero que você tenha achado interessante. Boa sorte com as paradas!








All Articles