Tutorial: Viewport with minimal configuration

    <!-- include PMA.UI script & css -->
    <script src="pma.ui.js" type="text/javascript"></script>
    <link href="pma.ui.css" type="text/css" rel="stylesheet">

    <!-- the element that will host the viewport -->
    <div id="viewer" style="height: 500px"></div>

    <script type="text/javascript">
        console.log("PMA.UI loaded: " + PMA.UI.getVersion());

        // initialize the viewport
        var viewport = new PMA.UI.View.Viewport({
                caller: "PMA.UI demo",
                element: "#viewer",
                image: "Reference/3DHistech/CMU-1.mrxs",
                serverUrls: ["https://host.pathomation.com/pma.core.2/"],
                username: "PMA_UI_demo",
                password: "PMA_UI_demo"
            },
            function () {
                console.log("Success!");
            },
            function () {
                console.log("Error! Check the console for details.");
            });
    </script>

Result: