How to use convert-units - 10 common examples

render3D: function (element, layer, scene) {

    let loader = new Three.TextureLoader();
    let whitePaintTextureRepeatFactor = 1 / 20; // In a 100x100 area i want to repeat this texture 5x5 times

    let newWidth = convert(element.properties.get('width').get('length'))
      .from(element.properties.get('width').get('unit'))
      .to(scene.unit);

    let newDepth = convert(element.properties.get('depth').get('length'))
      .from(element.properties.get('depth').get('unit'))
      .to(scene.unit);

    let newHeight = convert(element.properties.get('height').get('length'))
      .from(element.properties.get('height').get('unit'))
      .to(scene.unit);

    let newAltitude = convert(element.properties.get('altitude').get('length'))
      .from(element.properties.get('altitude').get('unit'))
      .to(scene.unit);

    let stair = new Three.Object3D();

    // compute step dimensions with Blondel formula
    let a = (63 * newHeight) / (newDepth + 2 * newHeight);
    let p = 63 - 2 * a;

let onLoadItem = (object) => {
      let newWidth = convert(width.length).from(width.unit).to(scene.unit);
      let newHeight = convert(height.length).from(height.unit).to(scene.unit);
      let newDepth = convert(depth.length).from(depth.unit).to(scene.unit);

      object.scale.set(newWidth / width.length, newHeight / height.length, newDepth / depth.length);

      let box = new BoxHelper(object, 0x99c3fb);
      box.material.linewidth = 2;
      box.material.depthTest = false;
      box.renderOrder = 1000;
      box.visible = element.selected;
      object.add(box);

      // Normalize the origin of this item
      let boundingBox = new Box3().setFromObject(object);

      let center = [
        (boundingBox.max.x - boundingBox.min.x) / 2 + boundingBox.min.x,
        (boundingBox.max.y - boundingBox.min.y) / 2 + boundingBox.min.y,

convert(distance, toUnit) {
    const fromUnitIdentifier = this.getUnitConversionIdentifier(distance.unit);
    const toUnitIdentifier = this.getUnitConversionIdentifier(toUnit);
    const convertedValue = convert(distance.value).from(fromUnitIdentifier).to(toUnitIdentifier);

    switch (toUnit) {
      case DistanceUnit.KILOMETER: {
        // Note divided by 1000 because convert library does not have kilometers, so using meters
        return {
          value: convertedValue / 1000,
          unit: DistanceUnit.KILOMETER,
        };
      }

      case DistanceUnit.MILE: {
        return {
          value: convertedValue,
          unit: DistanceUnit.MILE,
        };
      }

handleConversion = () => {
        if(this.state.flow === 'L2R') {
            this.setState({
                secondInput: convert(this.state.firstInput).from(this.state.firstQuantity).to(this.state.secondQuantity)
            })
        }
        else if(this.state.flow === 'R2L') {
            this.setState({
                firstInput: convert(this.state.secondInput).from(this.state.secondQuantity).to(this.state.firstQuantity)
            })
        }
    }

handleDistanceTypeChange = ({ target }) => {
    const { distance } = this.state;
    const distanceType = target.value;
    const convertedDistance = convert(distance).from(distanceType).to('cm');

    this.setState({ distanceType, convertedDistance },
      () => {
        this.handleBaseChange();
      });
  }

var update = function update(lengthInput, unitInput) {

    var newLength = toFixedFloat(lengthInput);
    var merged = value.merge({
      length: unitInput !== UNIT_CENTIMETER ? convert(newLength).from(unitInput).to(UNIT_CENTIMETER) : newLength,
      _length: lengthInput,
      _unit: unitInput
    });

    if (hook) {
      return hook(merged, sourceElement, internalState, state).then(function (val) {
        return onUpdate(val);
      });
    }

    return onUpdate(merged);
  };

let endAt = MathUtils.toFixedFloat(lineLength - (lineLength * offset) - halfWidthLength, PRECISION);
            let offsetUnit = attributesFormData.getIn(['offsetB', '_unit']);

            let offsetB = new Map({
              length: endAt,
              _length: convert(endAt).from(this.context.catalog.unit).to(offsetUnit),
              _unit: offsetUnit
            });

            attributesFormData = attributesFormData.set('offsetB', offsetB).set('offset', offset);

            let offsetAttribute = new Map({
              length: MathUtils.toFixedFloat(lengthValue, PRECISION),
              _unit: value.get('_unit'),
              _length: MathUtils.toFixedFloat(convert(lengthValue).from(this.context.catalog.unit).to(value.get('_unit')), PRECISION)
            });

            attributesFormData = attributesFormData.set(attributeName, offsetAttribute);

            break;
          }
          case 'offsetB':
          {
            let line = this.props.layer.lines.get(this.props.element.line);

            let orderedVertices = GeometryUtils.orderVertices([
              this.props.layer.vertices.get(line.vertices.get(0)),
              this.props.layer.vertices.get(line.vertices.get(1))
            ]);

            let [ {x: x0, y: y0}, {x: x1, y: y1} ] = orderedVertices;

var lengthValue = value.get('length');
                  lengthValue = Math.max(lengthValue, 0);
                  lengthValue = Math.min(lengthValue, lineLength - widthLength);

                  var xp = (lengthValue + halfWidthLength) * Math.cos(alpha) + x0;
                  var yp = (lengthValue + halfWidthLength) * Math.sin(alpha) + y0;

                  var offset = GeometryUtils.pointPositionOnLineSegment(x0, y0, x1, y1, xp, yp);

                  var endAt = MathUtils.toFixedFloat(lineLength - lineLength * offset - halfWidthLength, PRECISION);
                  var offsetUnit = attributesFormData.getIn(['offsetB', '_unit']);

                  var offsetB = new Map({
                    length: endAt,
                    _length: convert(endAt).from(this.context.catalog.unit).to(offsetUnit),
                    _unit: offsetUnit
                  });

                  attributesFormData = attributesFormData.set('offsetB', offsetB).set('offset', offset);

                  var offsetAttribute = new Map({
                    length: MathUtils.toFixedFloat(lengthValue, PRECISION),
                    _unit: value.get('_unit'),
                    _length: MathUtils.toFixedFloat(convert(lengthValue).from(this.context.catalog.unit).to(value.get('_unit')), PRECISION)
                  });

                  attributesFormData = attributesFormData.set(attributeName, offsetAttribute);

                  break;
                }
              case 'offsetB':

attributesFormData = attributesFormData.withMutations(function (attr) {
                    attr.set(attributeName, attr.get(attributeName).merge(value));

                    var newDistance = GeometryUtils.verticesDistance(attr.get('vertexOne'), attr.get('vertexTwo'));

                    attr.mergeIn(['lineLength'], attr.get('lineLength').merge({
                      'length': newDistance,
                      '_length': convert(newDistance).from(_this2.context.catalog.unit).to(attr.get('lineLength').get('_unit'))
                    }));
                  });
                  break;

var startAt = MathUtils.toFixedFloat(_lineLength * _offset - _halfWidthLength, PRECISION);
                  var _offsetUnit = attributesFormData.getIn(['offsetA', '_unit']);

                  var offsetA = new Map({
                    length: startAt,
                    _length: convert(startAt).from(this.context.catalog.unit).to(_offsetUnit),
                    _unit: _offsetUnit
                  });

                  attributesFormData = attributesFormData.set('offsetA', offsetA).set('offset', _offset);

                  var _offsetAttribute = new Map({
                    length: MathUtils.toFixedFloat(_lengthValue, PRECISION),
                    _unit: value.get('_unit'),
                    _length: MathUtils.toFixedFloat(convert(_lengthValue).from(this.context.catalog.unit).to(value.get('_unit')), PRECISION)
                  });

                  attributesFormData = attributesFormData.set(attributeName, _offsetAttribute);

                  break;
                }
              default:
                {
                  attributesFormData = attributesFormData.set(attributeName, value);
                  break;
                }
            };
            break;
          }
        default:
          break;