一键制作网站软件,电子商务网站建设管理答案,淄博张店网站建设,网站如何绑定公众号在需要使用的js页面引入js文件,传入对应参数即可
/**
* 文本竖向排列
*/
function drawTextVertical(context, text, x, y) {var arrText text.split();var arrWidth arrText.map(function (letter) {return 26; // 字体间距,需要自定义可以自己加参数,根据传入参数进行… 在需要使用的js页面引入js文件,传入对应参数即可
/**
* 文本竖向排列
*/
function drawTextVertical(context, text, x, y) {var arrText text.split();var arrWidth arrText.map(function (letter) {return 26; // 字体间距,需要自定义可以自己加参数,根据传入参数进行设置});var align context.textAlign;var baseline context.textBaseline;if (align left) {x x Math.max.apply(null, arrWidth) / 2;} else if (align right) {x x - Math.max.apply(null, arrWidth) / 2;}if (baseline bottom || baseline alphabetic || baseline ideographic) {y y - arrWidth[0] / 2;} else if (baseline top || baseline hanging) {y y arrWidth[0] / 2;}context.textAlign center;context.textBaseline middle;// 开始逐字绘制arrText.forEach(function (letter, index) {// 确定下一个字符的纵坐标位置var letterWidth arrWidth[index];// 是否需要旋转判断var code letter.charCodeAt(0);if (code 256) {context.translate(x, y);// 英文字符旋转90°context.rotate(90 * Math.PI / 180);context.translate(-x, -y);} else if (index 0 text.charCodeAt(index - 1) 256) {// y修正y y arrWidth[index - 1] / 2;}context.fillText(letter, x, y);// 旋转坐标系还原成初始态context.setTransform(1, 0, 0, 1, 0, 0);// 确定下一个字符的纵坐标位置var letterWidth arrWidth[index];y y letterWidth;});// 水平垂直对齐方式还原context.textAlign align;context.textBaseline baseline;
}module.exports {drawTextVertical: drawTextVertical
} 示例:
引入js 传入参数 页面显示