Customize Frame Size
To customize or adjust the frame size of your specified view.
Function Call
ObjName.resizeFrameSize(width, height)
Parameters
| Parameter Name | Description |
| width | Number / Percentage Enter the width of the view's frame size in pixel or percentage. |
| height | Number / Percentage Enter the height of the view's frame size in pixel or percentage. |
Sample Response
html>
px px
Sample Code:
Copied<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ZAnalytics JS API</title>
<link rel="icon" type="image/x-icon" href="https://analytics.zoho.com/favicon.ico">
<script src="https://downloads.zohocdn.com/zanalyticslib/jsapi/v1/zanalytics.min.js"></script>
</head>
<style>
input, button {
background: #fff;
border-radius: 3px;
border: 1px solid #b8b8b8;
height: 30px;
margin: 5px;
}
input {
width: 50px;
padding-left: 10px;
}
button {
cursor: pointer;
}
</style>
<body>
<div class="viewcontainer">
<div class="row" style="float: left;">
<label>Customize Frame Size:</label><br>
<label>Width: </label><input type="text" id="width" placeholder="Width" value='800'>px
<label style="margin-left: 15px;">Height: </label><input type="text" id="height" placeholder="Height" value='300'>px
<button onclick="resizeFrame()"> ReSize </button>
</div>
<div id="analysisView"></div>
<script>
const containerDiv = document.getElementById("analysisView");
const url = "https://analytics.zoho.com/open-view/2588560000000010083";
const options = {
width: '100%',
height: 600
};
const vizObj = new ZAnalyticsLib(containerDiv, url, options);
vizObj.createViz();
function resizeFrame() {
vizObj.resizeFrameSize(document.getElementById('width').value, document.getElementById('height').value);
}
</script>
</div>
</body>
</html>