FitViewer Developer Documentation

Quick start

User guides

Integration

First, install between <head> the FitViewer Javascript library using your CustomerID :
<script src="http://fitviewer.youarethemodel.com/js/CustomerID/FitViewer.js"></script>
* Refer to FittingBox Team to know your CustomerID, otherwise you can use demo for your tests.
Place a <div> tag identified by a uniq id into the <body> :
<div id="myFitViewer"></div>
Then, call Fb.FitViewer.GetInstance method to set your FitViewer into #myFitlive HTML element :
<script type="text/javascript">
    window.onload = function()
    {
        FitViewer = Fb.FitViewer.GetInstance(
            {
                FitViewer:
                {
                    container: '#myFitViewer',
                    skunumber: 'DG_DGS4164P-S-25518F-58-16-135'
                }
            }
        );
    }
</script>

Set frame

SetFrame method is used in order to set the frame to display.
<input type="button" value="Display" id="DisplayButton" rel="FrameID" />
<script type="text/javascript">
    window.onload = function()
    {
        FitViewer = Fb.FitViewer.GetInstance(
            {
                FitViewer:
                {
                    container: '#myFitViewer',
                    skunumber: 'DG_DGS4164P-S-25518F-58-16-135'
                }
            }
        );
        
        var DisplayButton = document.getElementById('DisplayButton');        
        DisplayButton.onclick = function()
        {
            var FrameID = this.getAttribute('rel');
            FitViewer.SetFrame(FrameID);
        }
    }
</script>
* Refer to FittingBox Team to know the list of FrameID you got, otherwise you can use DG_DGS4164P-S-25518F-58-16-135 for your tests.

Examples