|  | 
| 1 | 1 | Please take a look at "Plotting Requirement" and generate a javascript code that can be used to render the charts on an html element. | 
| 2 | 2 | 
 | 
| 3 |  | - | 
| 4 | 3 | === Plotting Requirement === | 
| 5 | 4 | {{ plotting_requirement }} | 
| 6 | 5 | 
 | 
| 7 |  | - | 
| 8 |  | -***** Important ***** | 
|  | 6 | +***** Hard Requirements ***** | 
| 9 | 7 | ** Your output must be a single <script>...</script> block with everything needed inside. | 
| 10 | 8 | ** You need to import Plotly.js to plot the charts. The script source should be "https://cdn.plot.ly/plotly-3.0.1.min.js". | 
| 11 | 9 | ** You need to add the MODE bar for each chart you plot. | 
| 12 | 10 | ** You must render the charts on the div html element with id {{ chart_element_id }}. | 
|  | 11 | +** Add a custom mode bar button named "Fullscreen" that toggles the chart container in and out of fullscreen using the Fullscreen API. Requirements for this button: | 
|  | 12 | +    * Always call the Fullscreen API on the chart container div itself (document.getElementById("{{ chart_element_id }}")), not on the document or on Plotly’s SVG. | 
|  | 13 | +    * Use el.requestFullscreen() with fallbacks to el.webkitRequestFullscreen || el.msRequestFullscreen. | 
|  | 14 | +    * Exit fullscreen with document.exitFullscreen() and vendor fallbacks. | 
|  | 15 | +    * Listen for fullscreenchange, webkitfullscreenchange, and msfullscreenchange to keep the button working across repeated clicks and ESC exits. | 
|  | 16 | +    * Ensure the chart fully expands and scales to the entire screen when fullscreen is active. | 
|  | 17 | +    * Provide a simple inline SVG path icon for the button (no external assets). | 
|  | 18 | +    * Use Plotly.newPlot(container, data, layout, {displayModeBar:true, modeBarButtonsToAdd:[fullscreenBtn]}); | 
|  | 19 | +    * fullscreenBtn must be a fully-formed object {name, title, icon, click}. | 
| 13 | 20 | ** You must not create any new html element. | 
| 14 | 21 | ** You must not apply any styles on any html element. | 
| 15 |  | -** You must generate as less token as possible. | 
|  | 22 | +** Keep code compact (few tokens), but fix all errors before returning. | 
|  | 23 | +** Please fix any code errors before returning the final response. | 
| 16 | 24 | 
 | 
| 17 | 25 | *** Response Format *** | 
| 18 | 26 | You must output the response in the following JSON format: | 
|  | 
0 commit comments