fix viewBox math so we see just what is there

This commit is contained in:
Scott Richmond 2024-08-01 18:35:28 -04:00
parent db5622bccd
commit 479e304357

View File

@ -267,17 +267,17 @@ export function svg (commands) {
}, {maxX: 0, maxY: 0, minX: 0, minY: 0})
const [r, g, b, a] = resolve_color(background_color)
const view_width = maxX - minX
const view_height = maxY - minY
const view_width = (maxX - minX) * 1.2
const view_height = (maxY - minY) * 1.2
const margin = Math.max(view_width, view_height) * 0.1
const x1 = Math.min(-300, (minX - margin))
const y1 = Math.min(-300, (minY - margin))
const x2 = Math.max(600, (maxX + margin))
const y2 = Math.max(600, (maxY + margin))
const x1 = minX - margin
const y1 = minY - margin
const x2 = maxX + margin
const y2 = maxY + margin
const path = svg_render_path(states)
const turtle = svg_render_turtle(states[states.length - 1])
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)">
${path}
@ -316,7 +316,7 @@ function p5_render_turtle (state, calls) {
return calls
}
export function p5_calls (commands) {
export function p5 (commands) {
const states = [turtle_init]
commands.reduce((prev_state, command) => {
const new_state = command_to_state(prev_state, command)