Edit in JSFiddle

Vendavo.Quantity({
    container: '#uomPlace1',
    state: Vendavo.componentModes.FORM_WRITE,
    value: -999.2,
    precision: 1,
    negative: true,
    formMode: {
        items: [{
            key: 'KG',
            label: 'KG - Kilogram'
        }, {
            key: 'LB',
            label: 'LB - Pound'
        }],
        defaultValue: 'LB'
    }
});

Vendavo.Quantity({
    container: '#uomPlace2',
    value: 1234,
    state: Vendavo.componentModes.FORM_READ,
    label: 'LB'
});

Vendavo.Quantity({
    container: '#uomPlace3',
    value: 1234,
    state: Vendavo.componentModes.PRESENTATION,
    label: 'Kg',
    locales: ['cs-CZ']
});

// DON'T REMOVE THIS
var path = "http://ux01-paux.xenre.vendavo.com/proto_ux-enterprise/_/";
var styles = ['css/styleguide.css', 'css/theme.css'];
styles.forEach(function (item, i) {
    var style = document.createElement('link');
    style.rel = 'stylesheet';
    style.type = 'text/css';
    style.href = path + item;
    document.getElementsByTagName('head')[0].appendChild(style);
});
// DON'T REMOVE THIS ^^^^^^^

<script src="http://ux01-paux.xenre.vendavo.com/pezzi/Pezzi.build.js"></script>
<section class="container">
    <div class="row row-offcanvas row-offcanvas-right">
        <div class="content col-xs-12 col-sm-9">
            <br />
            <!-- HERE IS PLACE WHERE COMPONENT WILL BE RENDERED -->
            <form id="uomPlace1"></form>
            <br />
            <form id="uomPlace2"></form>
            <br />
            <p id="uomPlace3"></p>
            <br />
        </div>
    </div>
</section>