protected override void GeneratePattern()
{
var period = Math.Floor(HexVal(0, 1).MapTo(0, 15, 100, 400));
var amplitude = Math.Floor(HexVal(1, 1).MapTo(0, 15, 30, 100));
var waveWidth = Math.Floor(HexVal(2, 1).MapTo(0, 15, 3, 30));
Svg.Width = period;
Svg.Height = waveWidth * 36;
for (var i = 0; i <= 35; i++)
{
var val = HexVal(i, 1);
var opacity = Opacity(val);
var fill = FillColor(val);
var xOffset = period / 4 * 0.7;
var styles = new Dictionary <string, object>
{
{ "fill", "none" },
{ "stroke", fill },
{ "style",
new Dictionary <string, object>
{
{ "opacity", opacity },
{ "stroke-width", waveWidth + "px" }
} }
};
var str = "M0 " + amplitude
+ " C " + xOffset + " 0, " + (period / 2 - xOffset) + " 0, " + (period / 2) + " " + amplitude
+ " S " + (period - xOffset) + " " + (amplitude * 2) + ", " + period + " " + amplitude
+ " S " + (period * 1.5 - xOffset) + " 0, " + (period * 1.5) + ", " + amplitude;
Svg.Path(str, styles.Merge(Transform("translate(-{0}, {1})", period / 4, waveWidth * i - amplitude * 1.5)));
Svg.Path(str, styles.Merge(Transform("translate(-{0}, {1})", period / 4, waveWidth * i - amplitude * 1.5 + waveWidth * 36)));
}
}
public PathsModule()
{
Get["/examples/w3schools/paths/1"] = _ =>
{
var svg = new Svg(400, 210);
svg.Path()
.MoveTo(150, 0)
.LineTo(75, 200)
.LineTo(225, 200)
.ClosePath();
return Response.AsText(svg.ToString(), "image/svg+xml");
};
Get["/examples/w3schools/paths/2"] = _ =>
{
var svg = new Svg(450, 400);
svg.Path()
.MoveTo(100, 350)
.LineToRelative(150, -300)
.ClosePath()
.WithStroke("red")
.WithStrokeWidth(3)
.WithFill("none");
svg.Path()
.MoveTo(250, 50)
.LineToRelative(150, 300)
.ClosePath()
.WithStroke("red")
.WithStrokeWidth(3)
.WithFill("none");
svg.Path()
.MoveTo(175, 200)
.LineToRelative(150, 0)
.ClosePath()
.WithStroke("green")
.WithStrokeWidth(3)
.WithFill("none");
svg.Path()
.MoveTo(100, 350)
.QuadraticBezierRelative(150, -300, 300, 000)
.WithStroke("blue")
.WithStrokeWidth(5)
.WithFill("none");
// Mark relevant points
var relevantPoints = svg.Group()
.WithStrokeWidth(3)
.WithFill("black");
relevantPoints.Circle(100, 350, 3);
relevantPoints.Circle(250, 50, 3);
relevantPoints.Circle(400, 350, 3);
// Label the points
var labels = svg.Group()
.WithFontSize(30)
.WithFontFamily("sans-serif")
.WithFill("black")
.WithStroke("none")
.WithTextAnchor(TextAnchor.Middle);
labels.Text(100, 350, "A").WithDx(-30);
labels.Text(250, 50, "B").WithDy(-10);
labels.Text(400, 350, "C").WithDx(30);
return Response.AsText(svg.ToString(), "image/svg+xml");
};
}
public PathsModule()
{
Get["/examples/w3schools/paths/1"] = _ =>
{
var svg = new Svg(400, 210);
svg.Path()
.MoveTo(150, 0)
.LineTo(75, 200)
.LineTo(225, 200)
.ClosePath();
return(Response.AsText(svg.ToString(), "image/svg+xml"));
};
Get["/examples/w3schools/paths/2"] = _ =>
{
var svg = new Svg(450, 400);
svg.Path()
.MoveTo(100, 350)
.LineToRelative(150, -300)
.ClosePath()
.WithStroke("red")
.WithStrokeWidth(3)
.WithFill("none");
svg.Path()
.MoveTo(250, 50)
.LineToRelative(150, 300)
.ClosePath()
.WithStroke("red")
.WithStrokeWidth(3)
.WithFill("none");
svg.Path()
.MoveTo(175, 200)
.LineToRelative(150, 0)
.ClosePath()
.WithStroke("green")
.WithStrokeWidth(3)
.WithFill("none");
svg.Path()
.MoveTo(100, 350)
.QuadraticBezierRelative(150, -300, 300, 000)
.WithStroke("blue")
.WithStrokeWidth(5)
.WithFill("none");
// Mark relevant points
var relevantPoints = svg.Group()
.WithStrokeWidth(3)
.WithFill("black");
relevantPoints.Circle(100, 350, 3);
relevantPoints.Circle(250, 50, 3);
relevantPoints.Circle(400, 350, 3);
// Label the points
var labels = svg.Group()
.WithFontSize(30)
.WithFontFamily("sans-serif")
.WithFill("black")
.WithStroke("none")
.WithTextAnchor(TextAnchor.Middle);
labels.Text(100, 350, "A").WithDx(-30);
labels.Text(250, 50, "B").WithDy(-10);
labels.Text(400, 350, "C").WithDx(30);
return(Response.AsText(svg.ToString(), "image/svg+xml"));
};
}