Kaop打印项之多边形

多边形

功能说明

实现多边形的打印，支持线型、线宽、顶点、填充等设置，详细参见属性列表。

属性列表

属性名	类型	默认值	说明
name	String	“”	打印项的名称，在打印任务内应该唯一。
label	String	“”	打印项的标题，打印设计或维护时， 可以更好的了解打印项代表的含义。
x	String	0	左边缘相对于打印区域的位置，默认单位毫米(mm)， 可用单位: 毫米 - mm，如：“10mm” 厘米 - cm，如：“1cm” 点 - pt，如：“16pt” 英寸 - in，如：“1in” 派卡 - pc，如：“2pc” 像素 - px，如：“10px” 单位换算关系: 1in = 2.54cm = 25.4 mm = 72pt = 6pc=96px， 同时支持百分比，如：“20%”,表示占父容器可 用宽度的20%的位置。
y	String	0	上边缘相对打印区域的位置，默认单位毫米(mm), 支持单位及单位换算参见"x"属性，同时支持百分比， 如：“20%”,表示占父容器可用高度的20%的位置
width	String	null	宽度，默认单位毫米(mm), 支持单位及单位换算参见"x"属性，同时支持百分比， 如：“20%”,表示占父容器可用宽度的20%。
height	String	null	高度，默认单位毫米(mm), 支持单位及单位换算参见"x"属性，同时支持百分比， 如：“20%”,表示占父容器可用高度的20%。
zindex	Integer	0	打印项所在图层，图层数值大的打印项会遮挡 图层数值小的打印项。
points	String	null	多边形顶点，格式为"顶点1的x坐标,顶点1的y坐标,顶点2的x坐标,顶点2的y坐标,…顶点n的x坐标，顶点n的y坐标",坐标支持单位及单位换算参见"x"属性。
lineWidth	String	“0.5pt”	线宽，默认单位毫米(mm)，支持单位及单位换算参见"x"属性
lineDash	String	null	线型，默认null表示实线，可以分别指定每个边 的线型，如： “dash dot-dash dash dot-dash” 表示上边为虚线，右边为点划线，底边为虚线， 左边为点划线。也可指定所有边为统一的线型，如： "dash"所有边为虚线。 线型有效值如下： solid - 实线 dotted - 点线 dashed - 虚线 dot-dash - 点划线 double-dot-dash - 双点划线 自定义 -线型由 “线+缺口+线+缺口+线+缺口……” 组成，如：“6pt 3pt”。
lineColor	String	null	线颜色，支持CSS中颜色定义规范,如： “#fff”, “#f2f2f2”, “rgb(255,255,0)”, “rgba(255,255,0,125)”
fillColor	String	null	填充颜色，颜色定义参见属性"lineColor"。
fillImage	String	null	填充图片，支持base64和其他标准url
roate	Float	0	旋转角度
margin	String	null	外边距，类似CSS中margin，如： "1pt 2pt 3pt 4pt"表示上右下左的外边距 分别为1pt、2pt、3pt、4pt；
hRelativeTo	String	null	水平位置相对于，可选值为: 相对于前面的打印项 - pre 线对于指定打印项 - #+打印项名称，如：“#text1”
vRelativeTo	String	null	垂直位置相对于，可选值为: 相对于前面的打印项 - pre 线对于指定打印项 - #+打印项名称，如：“#text1”
fixed	Boolean	false	是否在每页重复出现，当设置为true时，该打印项会出现在每页的相应位置，可以实现诸如水印等特殊业务场景。

示例代码

//create print job
var job = Kaop.createPrintJob("Design Print Job");

//pages
//the page 0
job.addPoly("多边形_5","23.019,39.394,33.019,34.394,43.019,39.394,48.019,49.394,43.019,59.394,23.019,59.394");
job.addPoly("多边形_5(复本)","98.445,33.779,108.445,58.779,88.445,58.779");
job.setItemAttr("多边形_5(复本)","lineDash","dashed");
job.addPoly("多边形_5(复本)","148.872,39.573,158.872,34.573,168.872,39.573,168.872,59.573,148.872,59.573");
job.setItemAttr("多边形_5(复本)","fillColor","#5c5757");

//actions
job.preview();

预览效果