MCS Publishing | PPF Image Widget

Images can be added manually to a report but must be uploaded to MCS to do so. The image widget allows images to be imported from external sources instead.

Only options marked as required must be defined — all others use sensible defaults.

var ppf_widgets = {
    example_image: {
        ele: ['eximage'],
        src: 'https://example.com/image.png',
        datadepend: ['voip', 'act'],
        width: '200px',
        height: '200px',
        alttxt: 'image',
        url: '',
        type: 8,
        depend: [[]]
    }
}

Key	Description
`ele`	Required. HTML element IDs where the image should render. Example: `ele: ['eximage']`
`type`	Required. Must be `8` for an image widget.
`src`	Required. The image source — a fully qualified URL or a path relative to the page. Note that using HTTP when the report uses HTTPS will cause the image request to fail. Example: `src: 'https://example.com/image.png'`
`datadepend`	If the widget depends on a certain data type, define as an array. Common types: `voip`, `act` (Quality), `route`, `capacity`.
`width`	Image width as pixels or percentage. Example: `'200px'`
`height`	Image height as pixels or percentage. Example: `'200px'`
`alttxt`	Alt text displayed if the image is unavailable. Also good practice for accessibility and SEO. Example: `'image alt text'`
`url`	Makes the image clickable, opening the URL in the same window. Example: `'https://www.visualware.com'`
`depend`	Widget dependencies. See dependency information.

PPF Image Widget

Overview

Full Example

Defining an Image Widget