Custom HTML Element

Add View in HTML

<!-- Add view in HTML -->
<wms-view id="viewId"></wms-view>

<!-- Add view with zoom (optional) -->
<wms-view id="viewId" zoom="1.5"></wms-view>

<!-- Add view with staff size, the distance between bottom and top staff lines (optional) -->
<wms-view id="viewId" staff-size="40px"></wms-view>

⚠️

Using staff size with units "cm", "mm", "in", etc. are not accurate and can give different result on devices.

Bind View in JavaScript

<script>
    // Bind document to view
    const doc = new Score.DocumentBuilder().getDocument();
    doc.bindElement("viewId");
</script>

Live Example