4.4渲染
> 初始化完成后，通过`Render(option)`方法渲染界面。
## Render
* 参数：
`{Object} option` 界面参数配置 ，参数详情参考下面的说明。非必传。
* 返回值：无
* 作用：配置界面显示参数并渲染，在`Init`方法后调用。
*****
`option` 参数说明
| 键(key) | 类型(type)| 说明(desc) |
| --- | --- |---|---|
| `readonly` | `Boolean` | 非必传，只读模式，只读模式会隐藏掉底部toolbar。默认 `false`。|
| `signareas` | `Array` | 非必传，自定义固定签字域。参数详情见下面的说明 |
| `toolbars` | `Array` | 非必传，自定义底部toolbars，参数详情见下面的说明。 |
| `moreActions` (2.0.3+) | `Array` | 非必传，自定义更多按钮的弹窗，参数详情见下面的说明。 |
| `showSignareaBtn` (2.0.3+) | `Array` | 非必传，是否在更多按钮中显示固定签字域按钮，默认`true`。 |
| `toolbarBtnColor` | `String` | 非必传，底部toolbars和moreAction 的文字颜色，默认`#007aff`。支持rgb、rgba和十六进制值代码的颜色（比如 `rgb(255,0,0)`、`rgba(255,0,0,0.5)`、`#00a0ff`） |
| `toolbarBackColor` | `String` | 非必传，底部toolbars背景颜色，默认`#007aff`，支持rgb、rgba和十六进制值代码的颜色。 |
| `autoRefreshWhileRotateScreen` | `Boolean` | 非必传，屏幕旋转的时候自动调整视图尺寸。默认`true`。 |
| `showWriteSaveBtn` | `Boolean` | 非必传，圈批界面在底部`toolbar`显示保存按钮，点击该按钮会直接触发保存事件，并关闭圈批状态。默认`false` |
| `showWritePagingBtn` | `Boolean` | 非必传，圈批界面在底部`toolbar`显示上下翻页按钮，点击该按钮会上下滚动页面。默认`false` 。|
| `maxZoomRate` (2.0.1+) | `Number` | 非必传，文件最大缩放倍率。默认`4` |
| `minZoomRate` (2.0.2+) | `Number` | 非必传，文件最低缩放倍率。默认`1` |
| `optBtnPlacement` (2.0.2+) | `String` | 非必传，toolbar位置，可选值`top、bottom`。默认`bottom（底部）。`|
| `editLimit` (2.0.3+) | `Object` | 非必传，限制本次编辑签名、文本、图片、田字格等最大插入数量。参数详情见下面的说明。 |
| `deleteCallerIds` (2.0.4+) | `Array` | 非必传，可删除笔迹、文本、图片、签批的callerId数组。参数详情见下面的说明。 |
| `signboardLineSize` (2.0.5+) | `Number` | 非必传，签字板默认笔迹粗度，默认5，合法范围1-8。 |
| `writingRate` (2.0.6+) | `Number` | 非必传，圈批的时候，笔迹的清晰度。默认2，合法返回1-9。倍数越高笔迹清晰度越高，但书写流畅和渲染速度越慢。 |
| `defaultWordSize` (2.0.6+) | `Number` | 非必传，默认田字格笔迹粗度。默认3，合法范围1-8。 |
| `defaultWriteSize` (2.0.6+) | `Number` | 非必传，默认圈批笔迹粗度。默认3，合法范围1-8。 |
| `signTogether` (2.0.7+) | `Boolean` | 非必传，是否启动一起签功能，默认`false`。 |
| `customeTimeStampFormat` (2.0.8+) | `Function` | 非必传，自定义时间戳字符串。使用详情见下面说明。 |
| `custimeSaveSucceedMessage` (2.0.8+) | `String` | 非必传，自定义保存成功提示。传空字符串将不会弹出提示。 |
| `showSignseal` (2.0.8+) | `Boolean` | 是否支持签章功能，默认`false`。 |
| `signboardDirection` (2.0.8+) | `String` | 签字板书写方向，默认`hor`。可选值：hor(横向)、ver(竖向) |
| `defaultUnSaveToastText` (2.0.8+) | `String` | 默认无数据的时候，触发保存吐司信息，`''`时不会提示文本，默认`''` |
| `signboardLineColor` (2.0.8+) | `String` | 初始签字板笔迹颜色，默认`#404040`, 可选范围`['#404040', '#1A1A1A', '#0D449B', '#C41018']` |
| `defaultWriteColor` (2.0.8+) | `String` | 初始圈批笔迹颜色，默认`#404040`, 可选范围`['#404040', '#1A1A1A', '#0D449B', '#C41018']`|
*****
`signareas` 说明：自定义的签字域，会在文件界面中显示一块签字区域，用户点击后会直接弹出**签字板**或**田字格板**，书写完毕后会直接把笔迹填充到签字域中。默认`[]`空数组。such as：
```html
[
{ page: 1, content: '甲方签字', height: '0.1', width: '0.4', x: '0.3', y: '0.4', id: 'sign1', type: 'signname' }
]
```
| 键(key) | 类型(type)| 说明(descript) |
| --- | --- |---|
| `page` | `Number` | 页码。页码从1开始计数。 |
| `content` | `String` | 签字域的提示信息。|
| `width` | `String` | 签字域宽度 和 页面宽度 比例，转字符串。 |
| `height` | `String` | 签字域高度 和 页面高度 比例，转字符串。 |
| `x` | `String` | 签字域 x 和 页面 宽度 比例，转字符串。 |
| `y` | `String` | 签字域 y 和 页面 高度 比例，转字符串。 |
| `id`(2.0.2+) | `String` | 签字域的唯一标识，建议不要重复。 |
| `type`(2.0.2+) | `String` | 签字域的签字类型`signname(签名)、word(田字格)`。默认`signname` |
*****
`toolbars` 参数说明。如果你想自定义按钮，请参考**常见问题**章节。默认值：
~~~js
[
{ name: 'text', title: '文本', icon: 'ws-icon-text' },
{ name: 'write', title: '圈批', icon: 'ws-icon-fullwritecopy' },
{ name: 'signboard', title: '签字板', icon: 'ws-icon-whiteboard1' },
{ name: 'more', title: '更多', icon: 'ws-icon-more' },
{ name: 'save', title: '保存', icon: 'ws-icon-save' }
]
~~~
`moreActions` 参数说明。默认值：
~~~js
[
{ name: 'image', title: '图片', icon: 'ws-icon-pic' },
{ name: 'valid', title: '验签', icon: 'ws-icon-pic' },
{ name: 'thumb', title: '缩略图', icon: 'ws-icon-album' },
{ name: 'word', title: '田字格', icon: 'ws-icon-fullwrite1' }
]
~~~
> 目前田字格功能只适配了Mobile端，PAD端暂未适配。
| 键(key) | 类型(type)| 说明(descript) |
| --- | --- |---|
| `name` | `String` | 按钮名称。[save（保存）, more（更多）, signarea-xxx（签字域）, signname（签名), camera（签名）] 为视图占用字段，请不要使用。当使用[text（文本）, write（圈批）, signboard（签字板）, image（图片）,waterfall（流式表单）] 会替换掉原有的按钮标题、图标。 |
| `title` | `String` | 按钮的标题。|
| `icon` | `String` | 字体图标完整的`class`名称（阿里云字体图标库挺好用的，[阿里云图标字体库](https://www.iconfont.cn/collections/index)）。such as: 字体图标下载并引入到html后，`icon`参数可以命名为`iconfont icon-setting` |
*****
`editLimit` 参数说明，配置本参数会限制本次签字插入对象的数量，`-1`为不做限制。such as：
~~~js
{
signname: 1, // 签名、签字域、签字，不能超过1个。
text: 2, // 文本，不能超过2个。
word: 3, // 田字格，不能超过3个。
image: -1 // 图片，无限制。
}
~~~
*****
`deleteCallerIds` 可删除笔迹、文本、签批、图片的`callerId`数组，合理的配置本参数可以让用户删除文件上的笔迹信息。本数组中的`callerId`和`Init`方法的`callerId`参数相同时，将允许用户在验签界面中删除掉的笔迹等信息：
~~~js
[ 'ws', 'wellsign' ]
~~~
*****
`customeTimeStampFormat` 自定义签名时间戳字符串，需传入一个方法，方法返回时间字符串。
~~~js
ctx.Render({
...options,
customeTimeStampFormat: function () {
var time = new Date()
var year = time.getFullYear()
var mounth = time.getMonth() + 1
var day = time.getDay()
return year + '年' + mounth + '月' + day + '日'
}
})
~~~