twc/ludus
4
0
Fork 0
Code Issues 32 Pull Requests Packages Projects 8 Releases Wiki Activity

fix viewBox math so we see just what is there

Browse Source
This commit is contained in:
Scott Richmond 2024-08-01 18:35:28 -04:00
parent db5622bccd
commit 479e304357
1 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
build/ludus.mjs
View File

@ -267,17 +267,17 @@ export function svg (commands) {
}, {maxX: 0, maxY: 0, minX: 0, minY: 0}) }, {maxX: 0, maxY: 0, minX: 0, minY: 0})
const [r, g, b, a] = resolve_color(background_color) const [r, g, b, a] = resolve_color(background_color)
const view_width = maxX - minX const view_width = (maxX - minX) * 1.2
const view_height = maxY - minY const view_height = (maxY - minY) * 1.2
const margin = Math.max(view_width, view_height) * 0.1 const margin = Math.max(view_width, view_height) * 0.1
const x1 = Math.min(-300, (minX - margin)) const x1 = minX - margin
const y1 = Math.min(-300, (minY - margin)) const y1 = minY - margin
const x2 = Math.max(600, (maxX + margin)) const x2 = maxX + margin
const y2 = Math.max(600, (maxY + margin)) const y2 = maxY + margin
const path = svg_render_path(states) const path = svg_render_path(states)
const turtle = svg_render_turtle(states[states.length - 1]) const turtle = svg_render_turtle(states[states.length - 1])
return `<?xml version="1.0" standalone="no"?> return `<?xml version="1.0" standalone="no"?>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" style="background-color:rgb(${r} ${g} ${b}); background-opacity: ${a/255}" viewBox="${x1} ${y1} ${x2} ${y2}"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" style="background-color:rgb(${r} ${g} ${b}); background-opacity: ${a/255}" viewBox="${x1} ${-y2} ${view_width} ${view_height}">
<g transform="scale(-1, 1) rotate(180)"> <g transform="scale(-1, 1) rotate(180)">
${path} ${path}
@ -316,7 +316,7 @@ function p5_render_turtle (state, calls) {
return calls return calls
} }
export function p5_calls (commands) { export function p5 (commands) {
const states = [turtle_init] const states = [turtle_init]
commands.reduce((prev_state, command) => { commands.reduce((prev_state, command) => {
const new_state = command_to_state(prev_state, command) const new_state = command_to_state(prev_state, command)