@bluemath/geom
Version:
Bluemath Geometry library
104 lines (93 loc) • 2.44 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>BlueMath NURBS Playground</title>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-AMS-MML_HTMLorMML" type="text/javascript"></script>
<script src="../build/bluemath-geom-visual.js"></script>
<style>
.ui-draggable, .ui-droppable {
background-position: top;
}
#knotsliders {
width : 800px;
margin : 20px;
}
.knotslider {
margin : 10px;
}
.knotslider > .ui-slider-handle {
width : 40px;
text-align: center;
}
#curve-viz {
display : flex;
flex-direction: column;
}
#curve-viz #output {
display : flex;
flex-direction: row;
}
#curve-viz #output #equations {
display : flex;
flex-direction: column;
justify-content: space-around;
}
#curve-viz #output #equations > * {
}
#curve-viz #input #clamped-one-knots {
}
#curve-viz #input #weights #eq > span {
height:120px;
float:left;
margin:15px
}
</style>
</head>
<body>
<div id="selection_box">
<select id="geom-selection"></select>
</div>
<div id="curve-viz">
<div id="output">
<div id="mainplot"></div>
<!--
<div id="equations">
<div id="curve_eqn">
$$ C(u) = \sum_{i=0}^n N_{i,p}(u) P_i $$
</div>
<div id="basis_eqn">
$$
N_{i,p}(u) = \frac{u-u_i}{u_{i+p}-u_i} N_{i,p-1}(u) + \frac{u_{i+p+1}-u}{u_{i+p+1}-u_{i+1}} N_{i+1,p-1}(u)
\\
\begin{equation}
N_{i,0}(u)=
\begin{cases}
1, & \text{if } u_i \leq u < u_{i+1}\\
0, & \text{otherwise}
\end{cases}
\end{equation}
\\
\text{Specified over Knot Vector U} \\
U = \{ u_0,...,u_m \}
$$
</div>
</div>
-->
</div>
<div id="input">
<div id="knotsliders">
</div>
<div id="weights">
</div>
</div>
</div>
<div id="action-viz">
<div id="mainplot"></div>
</div>
</body>
</html>