Differences

This shows you the differences between two versions of the page.

--- api:chart [2019/12/30 14:51] – [Solar production estimate chart] knutkohl
+++ api:chart [2023/08/10 09:45] (current) – [Solar production estimate chart] knutkohl
@@ Line 1: / Line 1: @@
 ====== Solar production estimate chart ======
-([[:account models#Professional|Professional account]] only)
+([[:account models#Professional|Professional accounts]] only)
 You can direct draw forecast estimate charts via API calls.
@@ Line 10: / Line 10: @@
 So the process of drawing a chart consists of 3 parts:
-  - Request a unique token for your plane(s), combine up to 3 (You can [[http://forecast.solar/build.html#ec1|build the URL]] with the helper page and get the script tag directly with the Test button.)
+  - Request a unique token for your plane(s), combine up to 3 (you can [[http://forecast.solar/build.html#ec1|build the URL]] with the helper page and get the script tag directly with the Test button)
   - Init JavaScript chart functions, once per page
   - Draw concrete chart by placing the JavaScript snippet exact at the place, where the chart should be shown.
@@ Line 48: / Line 48: @@
 ==== Chart URL for tomorrow  ====
-<code>
-https://api.forecast.solar/chart/1/pDvJw75F.js
+  https://api.forecast.solar/chart/1/pDvJw75F.js
-</code>
 You can draw the chart **up to 6 days** in advance!
+Please load the scripts **always** defered to not block the page loading!
 <code>
 <-- ----------------------------------------------------------------------
- -- Init chart functions, required only once per page
+ -- Init chart functions, required only ONCE per page
+ -- Put this always BEFORE the chart scripts!
  -- ------------------------------------------------------------------ -->
-<script src="https://api.forecast.solar/chart/init.js"></script>
+<script defer src="https://api.forecast.solar/chart/init.js"></script>
 <div style="text-align:center">
     <-- ------------------------------------------------------------------
      -- Custom header
@@ Line 69: / Line 70: @@
     <-- ------------------------------------------------------------------
      -- Wrap script with a DIV with dimensions to define chart size
-     -- The chart works perfect with deferred loading!
      -- -------------------------------------------------------------- -->
     <div style="width:400px;height:200px;margin:auto">
         <script defer src="https://api.forecast.solar/chart/pDvJw75F.js"></script>
     </div>
 </div>
 </code>
+==== Parameters ====
+You can provide 2 parameters to the script:
+  * ''title'' - Chart title
+  * ''subtitle'' - Chart subtitle
+You can in both parameters use the follwing placeholders:
+  * ''{place}'' - Location of the plant
+  * ''{date}'' - Chart date
+If nothing is provided, no tilte is drawn and the subtitle becomes the date.
+If the title contains the ''{date}'' placeholder, the subtitle will **not** show the date.
+Full example
+  https://api.forecast.solar/chart/1/pDvJw75F.js?title=Chart+for+{date}&subtitle={place}
 ===== 3. Result =====
 {{ :2016-02-08_21_23_09-chart_example.png?nolink |}}