return {
_=function(frame)
local index={}
do
for i=0,512 do
table.insert(index,i)
end
end
local factorial={}
do
local m=1
for i=1,32 do
table.insert(factorial,m)
m=m*i
end
end
local h={}
local j={}
do
for i=0,32 do
table.insert(h,i)
table.insert(j,i)
end
end
return frame:extensionTag('graph',mw.text.jsonEncode({
width=512,
height=512,
signals={
{
name="a",
init=0,
streams={
{
type="mousemove",
expr="(eventX()-256)/32"
}
}
},
{
name="d",
init=0,
streams={
{
type="wheel",
expr="clamp(d+clamp(event.deltaY,-1,1),0,32)"
}
}
},
{
name="factorial",
init=factorial
}
},
data={
{
name="h",
values=h
},
{
name="j",
values=j,
transform={
{
type="filter",
test="datum.data<=d"
},
{
type="formula",
field="t",
expr="sin(a+datum.data*PI/2)/factorial[datum.data]"
}
}
},
{
name="index",
values=index,
transform={
{
type="cross",
with="j"
},
{
type="formula",
field="c",
expr="datum.a.data"
},
{
type="formula",
field="r",
expr="datum.b.t*pow((datum.c-256)/32-a,datum.b.data)"
},
{
type="facet",
groupby={
"c"
},
summarize={
r={
{
"sum"
}
}
}
},
{
type="formula",
field="s",
expr="sin((datum.c-256)/32-a)"
}
}
}
},
marks={
{
type="group",
properties={
enter={
clip={
value=true
},
x={
value=0
},
y={
value=0
},
width={
value=512
},
height={
value=512
}
}
},
marks={
{
type="rect",
interactive=false,
from={
data="h"
},
properties={
enter={
x={
field="data",
mult=32,
offset=-1
},
y={
value=0
},
width={
value=2
},
height={
value=512
},
fill={
h={
value=180
},
s={
value=0.4
},
l={
value=0.975
}
}
}
}
},
{
type="rect",
interactive=false,
from={
data="h"
},
properties={
enter={
x={
value=0
},
y={
field="data",
mult=32,
offset=-1
},
width={
value=512
},
height={
value=2
},
fill={
h={
value=180
},
s={
value=0.4
},
l={
value=0.975
}
}
}
}
},
{
type="rect",
interactive=false,
properties={
enter={
x={
value=8,
mult=32,
offset=-1
},
y={
value=0
},
width={
value=2
},
height={
value=512
},
fill={
h={
value=180
},
s={
value=0.4
},
l={
value=0.75
}
}
}
}
},
{
type="rect",
interactive=false,
properties={
enter={
x={
value=0
},
y={
value=8,
mult=32,
offset=-1
},
width={
value=512
},
height={
value=2
},
fill={
h={
value=180
},
s={
value=0.4
},
l={
value=0.75
}
}
}
}
},
{
type="rect",
interactive=false,
properties={
enter={
y={
value=0
},
width={
value=2
},
height={
value=512
},
fill={
value="blue"
}
},
update={
x={
signal="a",
mult=32,
offset=-1+256
}
}
}
},
{
type="line",
interactive=false,
from={
data="index"
},
properties={
enter={
x={
field="c"
},
y={
field="s",
mult=-32,
offset=256
},
stroke={
value="black"
},
strokeWidth={
value=1.5
}
}
}
},
{
type="line",
interactive=false,
from={
data="index"
},
properties={
update={
x={
field="c"
},
y={
field="sum_r",
mult=-32,
offset=256
},
},
enter={
stroke={
value="red"
},
strokeWidth={
value=1.5
}
}
}
},
{
type="rect",
interactive=false,
properties={
enter={
x={
value=512-128
},
y={
value=16
},
width={
value=104
},
height={
value=64
},
fill={
value="white"
},
fillOpacity={
value=0.8
}
}
}
},
{
type="text",
interactive=false,
properties={
enter={
x={
value=512-112
},
y={
value=32
},
align={
value="left"
},
baseline={
value="middle"
},
fontSize={
value=24
},
fill={
value="black"
}
},
update={
text={
template="n = {{d}}"
}
}
}
},
{
type="text",
interactive=false,
properties={
enter={
x={
value=512-112
},
y={
value=64
},
align={
value="left"
},
baseline={
value="middle"
},
fontSize={
value=24
},
fill={
value="black"
}
},
update={
text={
template="a = {{a|number:'.2f'}}"
}
}
}
}
}
}
}
}),{mode='interactive'})
end
}
モジュールの解説[作成]