Website Graph API Integration

I’m connecting an instant-effect graph-generation API to my website and want each graph it returns to be accompanied by a cartoonish character portrayal. The workflow is simple: a visitor supplies data, the API is called, and the page immediately shows the graph plus the animated mascot style character that reacts to the numbers.

Here’s what I need from you:
• Wire the API into the existing site code so calls, auth keys, error handling, and caching are all neatly managed.
• Build a responsive front-end component that presents the graph and the cartoonish character side-by-side (or stacked on mobile).
• Keep load time under two seconds on a typical broadband connection.
• Provide concise setup documentation and a short snippet showing how to trigger the component with sample data.

The chosen portrayal style is Cartoonish; if we later decide to experiment with a more Stylized or even Realistic rendering, your code should make that an easy swap. Likewise, while my immediate need revolves around this character-driven visual, keeping the door open to classic Bar, Line or Pie chart endpoints would be ideal for future expansion.

When everything is in place I’ll test on desktop and mobile browsers; a pass means the graph renders, the character appears correctly, and Lighthouse performance stays in the green.