>How does SPX generate graphics output SPX has multiple options for playing out graphics. There are SPX's own [[Documentation/Renderer/Preview & Program|preview and program]], through different video software pipelines, and professional outputs via [[Documentation/Renderer/Workflows/SDI-NDI-2110|SDI/NDI/2110]]. --- ## Web render workflow [[Documentation/Renderer/Web Render|Web renderer]] is the HTML-based renderer output from SPX that supports up to 20 [[Documentation/Renderer/Layers|layers]] of simultaneous graphics using a single renderer URL. The typical output from SPX is in [**http://localhost:5656/renderer**](http://localhost:5656/renderer) This output URL will be added to a vision mixer or [[Documentation/Renderer/Workflows/Live Streaming Software|streaming applications]] "browser source" settings. The following parameters are supported: ### Defaults | Parameter | Type | Example | | --------- | ------- | ----------------------------------------------------- | | runScript | string | http://localhost:5656/renderer?runScript=playTemplate | | layers | array | http://localhost:5656/renderer?layers=\[1,2,3,10\] | | preview | boolean | http://localhost:5656/renderer?preview=true | Old *width* and *height* properties were removed (in v.1.3.0) and replaced with AUTO mode, read below. A combined full url can be for example: ``` http://localhost:5656/renderer?preview=true&layers=[1,2,3,10]&runScript=playTemplate ``` These parameters can allow for very complex production workflows having multiple outputs of different sizes and aspect ratios. In [[Documentation/Server/Configurations|SPX configuration]] a default output [[Documentation/Renderer/Resolutions|resolution]] is set to either HD, 4K or AUTO. SPX v1.3.0 introduced the **AUTO mode** that will automatically resize the output to match the video environment hosting the embedded HTML renderer (browser) and it's window size. This effectively removed the need to use the height/width values in the renderer, as this can be set in the video switcher's browser source settings. >[!warning] Typical SPX [[Documentation/Graphic Templates/Overview|templates]] are designed for 16:9 aspect ratio and responsiveness issues must be resolved on template-by-template basis. **runScript -option** was added in v.1.3.3 and value (such as "playTemplate") assumes there is a file */ASSETS/ExtraFunctions/playTemplate.js* available in the system. This javascript *module* -file must implement an exported **init()** -function which will be executed when the renderer loads. This allows, for example, loading a template with directplaytout command when the renderer loads. ### No frame accuracy! **Expectation management.** Since the SPX graphics output is based on loading HTML templates and additional assets, such as images, CSS files, and javascript libraries from local and potentially online sources (using a variety of computer hardware and software) the loading times of each template can vary and **SPX is not intended** for workflows requiring frame-accurate playout! ## CasparCG workflow [[Documentation/Renderer/Workflows/CasparCG - AMCP|CasparCG]] server can output video to HDMI, SDI, NDI and more and it has a *HTML producer*, capable of rendering HTML-based graphics templates. When using the CasparCG workflow, SPX will use AMCP protocol to send commands from SPX to CasparCG server(s) which will load individual HTML templates to specified servers > channels > layers. This enables flexible mixing of video and graphics-based content onto several layers. By default, the SPX configuration does not have **any** CasparCG servers available. Once servers are added to the [[Documentation/Graphics Controller/Application Configuration|configuration]], they will be shown at the top of the SPX user interface. ![[Pasted image 20260129104911.png]] Each server connection is indicated with GREEN (connected) or RED (disconnected) colors. Additionally sending of commands to each server can be toggled momentarily on or off for testing purposes in production environment. >[!warning] The server name "OVERLAY" is SPX's default server name in the templates. >[!info] See **[[CasparCG - AMCP|Adding CasparCG Servers]]** ## Alternative CasparCG workflow It is possible to load the SPX web renderer to the CasparCG server channel and layer using AMCP commands. Please note the actual syntax may vary between CasparCG server versions, the below example works in version 2.3 and newer: ``PLAY 1-10 [HTML] "http://localhost:5656/renderer" With this workflow, all the 20 SPX layers will be present in a single CasparCG layer. This can be useful for instance when setting up CasparCG-based previews. See below for details. --- ## Read Next - [[Documentation/Renderer/Web Render|Web Render]] - Detailed renderer parameters - [[Documentation/Renderer/Workflows/CasparCG - AMCP|CasparCG Setup]] - Configure CasparCG servers - [[Documentation/Renderer/Workflows/Live Streaming Software|Live Streaming Software]] - OBS, vMix integration - [[Documentation/Renderer/Preview & Program|Preview & Program]] - Output options