How do I handle widget security and hosting?

The skill provides guidance on hosting options (including SAC-hosted files) and helps generate SHA256 integrity hashes required for production deployments.

Does it support the Optimized Story Experience?

Absolutely. This skill is updated to support the latest standards for both the Optimized Story Experience and the Analytics Designer.

Can I use libraries like D3.js or ECharts with this skill?

Yes, the skill includes specific implementation patterns for integrating, rendering, and properly disposing of third-party charting libraries within the SAC widget lifecycle.

What is an SAC Custom Widget?

An SAC Custom Widget is a Web Component that allows developers to extend SAP Analytics Cloud with custom charts, UI elements, or specialized logic that are not available out-of-the-box.

How does this skill help with data binding?

It provides standardized templates and code snippets to map SAC data model dimensions and measures to your widget's internal data structures using the dataBindings metadata.

SAP Analytics Cloud Custom Widgets

Name: SAP Analytics Cloud Custom Widgets
Author: secondsky

bysecondsky

•

Analytics & Monitoring

Builds, debugs, and optimizes production-ready custom visualizations and interactive components for SAP Analytics Cloud.

About

This skill empowers developers to extend SAP Analytics Cloud (SAC) by creating sophisticated custom widgets and visualizations using Web Components. It streamlines the entire development lifecycle, from architecting JSON metadata and implementing JavaScript lifecycle hooks like onCustomWidgetAfterUpdate to configuring complex data bindings and ensuring security via SHA256 integrity hashes. Whether you're integrating third-party libraries like D3.js and ECharts or troubleshooting CORS and data-loading issues, this skill provides the templates and domain-specific guidance required for the Optimized Story Experience and Analytics Designer.

Key Features

Implementation of SAC-specific lifecycle functions and data binding feeds
6 GitHub stars
Optimization patterns for the Optimized Story Experience and Analytics Designer
Security validation including SHA256 integrity hash generation and CORS checks
Scaffolding for JSON metadata and Web Component JavaScript structures
Integration support for third-party libraries like ECharts, D3.js, and Chart.js

Use Cases

Creating bespoke data visualizations not available in standard SAC chart types
Troubleshooting and fixing widget loading, property sync, or data-binding errors
Building interactive input forms or KPI cards for Analytics Designer applications

About

Key Features

Implementation of SAC-specific lifecycle functions and data binding feeds
6 GitHub stars
Optimization patterns for the Optimized Story Experience and Analytics Designer
Security validation including SHA256 integrity hash generation and CORS checks
Scaffolding for JSON metadata and Web Component JavaScript structures
Integration support for third-party libraries like ECharts, D3.js, and Chart.js

Use Cases

Creating bespoke data visualizations not available in standard SAC chart types
Troubleshooting and fixing widget loading, property sync, or data-binding errors
Building interactive input forms or KPI cards for Analytics Designer applications