[FFA-502] Parse width and height

[pacowong]

https://goodnotes.atlassian.net/browse/FFA-502

Pedro shares the example below. The problem is that the canvas definition does not use "viewBox" and uses "width" and "height" attributes instead. As the default size of the canvas is 100 x 100, when the library parses <rect width="100%" height="100%" fill="#f4f4f4"/> which uses the parent context size, the rect size is 100x100, instead of 780 x 950.

<svg xmlns="http://www.w3.org/2000/svg" width="780" height="950">
  <!-- Background -->
  <rect width="100%" height="100%" fill="#f4f4f4"/>

  <!-- Title -->
  <text x="390" y="50" text-anchor="middle" font-size="24" font-weight="bold">1-to-1 Meeting Template</text>

  <!-- Header Information -->
  <text x="50" y="90" font-size="14">Date: [Date]</text>
  <text x="50" y="110" font-size="14">Attendees: [Manager Name], [Direct Report Name]</text>

  <!-- Agenda Sections -->
  <rect x="50" y="140" width="680" height="770" fill="white" stroke="#d0d0d0" stroke-width="1" rx="10"/>

  <!-- Section 1: Check-In -->
  <text x="70" y="180" font-size="16" font-weight="bold">1. CHECK-IN (5-10 min)</text>
  <text x="90" y="210" font-size="12">• Personal check-in/well-being</text>
  <text x="90" y="230" font-size="12">• Review previous action items</text>
  <text x="90" y="250" font-size="12">• Urgent items to discuss</text>
  <line x1="50" y1="270" x2="730" y2="270" stroke="#e0e0e0" stroke-width="1"/>

  <!-- Section 2: Performance Discussion -->
  <text x="70" y="300" font-size="16" font-weight="bold">2. PERFORMANCE DISCUSSION (15 min)</text>
  <text x="90" y="330" font-size="12">• Current projects status and milestones</text>
  <text x="90" y="350" font-size="12">• Recent accomplishments/wins</text>
  <text x="90" y="370" font-size="12">• Challenges or blockers</text>
  <text x="90" y="390" font-size="12">• Resource needs</text>
  <text x="90" y="410" font-size="12">• Areas for improvement</text>
  <line x1="50" y1="430" x2="730" y2="430" stroke="#e0e0e0" stroke-width="1"/>

  <!-- Section 3: Career Growth -->
  <text x="70" y="460" font-size="16" font-weight="bold">3. CAREER GROWTH (10-15 min)</text>
  <text x="90" y="490" font-size="12">• Progress on professional development goals</text>
  <text x="90" y="510" font-size="12">• Skills to develop</text>
  <text x="90" y="530" font-size="12">• Learning opportunities/training needs</text>
  <text x="90" y="550" font-size="12">• Alignment with career aspirations</text>
  <text x="90" y="570" font-size="12">• Potential stretch assignments</text>
  <line x1="50" y1="590" x2="730" y2="590" stroke="#e0e0e0" stroke-width="1"/>

  <!-- Section 4: Feedback Exchange -->
  <text x="70" y="620" font-size="16" font-weight="bold">4. FEEDBACK EXCHANGE (10 min)</text>
  <text x="90" y="650" font-size="12">• Feedback for direct report</text>
  <text x="90" y="670" font-size="12">• Feedback for manager</text>
  <text x="90" y="690" font-size="12">• Team dynamics observations</text>
  <text x="90" y="710" font-size="12">• Process improvement suggestions</text>
  <line x1="50" y1="730" x2="730" y2="730" stroke="#e0e0e0" stroke-width="1"/>

  <!-- Section 5: Next Steps & Action Items -->
  <text x="70" y="760" font-size="16" font-weight="bold">5. NEXT STEPS & ACTION ITEMS (5-10 min)</text>
  <text x="90" y="790" font-size="12">• Tasks and deliverables</text>
  <text x="90" y="810" font-size="12">• Deadlines and priorities</text>
  <text x="90" y="830" font-size="12">• Support required</text>
  <text x="90" y="850" font-size="12">• Follow-up meeting scheduling</text>
  <line x1="50" y1="870" x2="730" y2="870" stroke="#e0e0e0" stroke-width="1"/>

  <!-- Section 6: Additional Notes -->
  <text x="70" y="900" font-size="16" font-weight="bold">6. ADDITIONAL NOTES</text>
  <rect x="70" y="920" width="640" height="100" fill="#f9f9f9" stroke="#d0d0d0" stroke-width="1" rx="5"/>
</svg>

[khoi]

The SVGLengthParser parse % props to absolute values based on the parent width, height (fetched from context).

I wonder what would be the values parsed here for width and height, can u please check?

[pacowong]

Refer to the results in viewport-02.ref, if the % is used in the viewport attribute, the size will be 100x100.

[khoi]

what's this

[pacowong]

Thanks. Removed in eef6057