Using ruler lines with graphical signature

window.onload = function() {	
	//DsPdfViewer.LicenseKey = "***key***";
	let viewer;
	
	function updateDestinationLocation(destinationSize) {
		if(viewer) {
			var options = viewer.options;
			var pageSize = viewer.getPageSize(0);        
			options.signTool.location = {x: 80, y: 100};
		}
	}
	function onSignatureAdded(resultDetails) {
			viewer.scrollAnnotationIntoView(resultDetails.pageIndex, resultDetails.annotation);
	}

	let options = { 
		workerSrc: "/document-solutions/javascript-pdf-viewer/demos/product-bundles/build/dspdfviewer.worker.js",
		supportApi: getSupportApiSettings(),
		restoreViewStateOnLoad: false
	};

    options.signTool = {             
        ruler: { 
            Draw: [{ color: '#ffe21e', size: 2, type: 'solid', position: 20 },
                   { color: '#ff0000', size: 5, type: 'dashed', position: 50 }, 
		           { color: '#ffe21e', size: 2, type: 'solid', position: 80 } ],
            Type: [{ color: '#717171', size: 1, type: 'dashed', position: 30 } ]
        },
        afterShow: function(dialog) {
            updateDestinationLocation(dialog.destinationSize);
        },
        afterAdd: function (result) {
            onSignatureAdded(result);
            return true;
        }
    };    
	options.restoreViewStateOnLoad = false;
	
    viewer = new DsPdfViewer("#viewer", options);
    viewer.addDefaultPanels();
    viewer.addAnnotationEditorPanel();
    viewer.toolbarLayout.viewer = { 
        default: ['open', 'save', 'edit-sign-tool', 'edit-undo', 'doc-title', '$split', 'about'], 
        mobile: ['open', 'save', 'edit-sign-tool', 'edit-undo', 'doc-title', '$split', 'about'], 
        fullscreen: ['$fullscreen', 'open', 'save', 'edit-sign-tool', 'edit-undo', 'doc-title', '$split', 'about'] 
    };
    viewer.toolbarLayout.annotationEditor = { 
        default: ['open', 'save', 'edit-sign-tool', 'edit-undo', 'doc-title', '$split', 'about'], 
        mobile: ['open', 'save', 'edit-sign-tool', 'edit-undo', 'doc-title', '$split', 'about'], 
        fullscreen: ['$fullscreen', 'open', 'save', 'edit-sign-tool', 'edit-undo', 'doc-title', '$split', 'about'] 
    };    
    viewer.applyToolbarLayout();
    viewer.zoom = 70;
    viewer.onAfterOpen.register(function() { viewer.showSignTool(); });
		
	viewer.open("/document-solutions/javascript-pdf-viewer/demos/product-bundles/assets/pdf/viewer-signature-ruler.pdf");
}