Web SDK Reference - Create context from configuration

window.twikbot.createContextFromConfiguration(configurarationId, locale, target, options, startupParameters)

<div id="myCanvas"></div>
<div id="myParameters"></div>

let productKey = 'wheel';
let locale = '';  // Name of your translations file. Empty string if no translations are available.
let target = document.getElementById("myCanvas");

let context = window.twikit.createContextFromConfiguration(configurationId, locale, target , {
    loaded: function() {
        // Called when the context finished loading.
    },
    parametersReady: function(parameterContainer) {
        // Called when parameter HTML elements are ready.
        // 'parameterContainer' is a <div> element with parameter HTML elements contained in it.
        document.getElementById("parameters").appendChild(parameterContainer);
    },
    parameterDataReady: function(parameters) {
        // Called when parameter data is ready.
        // 'parameters' is an array of parameter data.
    },
    statusChanged: function(progress, status) {
        // Called while loading the context to report progress.
        // 'progress' is the progress percentage, an integer number between 0 and 100.
        // 'status' reports the loading state, either 'loading', 'ready' or 'failed'.
        console.log(progress + '%');
    },
    variationChanged: function(variation) {
        // Called when variation changed.
        console.log('variation changed', variation);
    },,
    twikbotContextReady: function(internalTwikbotContext) {
        // called when the internal context is ready
        internalTwikbotContext.numericComponent$.subscribe(numbers => console.log('number outputs : ', numbers));
        // an observable (rxjs) that list latest version of numeric outpu components if applicable in the product
    },
    previewBackgroundColor: '#eeeeee'  // Used to set the background color of the 3D canvas.
});