svg绘制简单yinz

function drawRingDouble(context){

seal_group = new Array();

//默认起始坐标
var starX = 325;
var starY = 330;

//内切圆半径 RX  注:RX与RY不相等时该圆为椭圆
var crx = 80;

//内切圆半径 RY 
var cry = 80;


//环排字与边距
var boderRange = 20;



//测试环排字
var sealDept = context;
var sealCharsArray = sealDept.split('');

/******* 配置参数 ********/
//开始角度
var sAg = -15;

//结束角度
var eAg = 195;


//环排文字X半径
var rx = crx-boderRange;
//环排文字Y半径
var ry = cry-boderRange;

if(sAg>180){
sAg = sAg-360;
}

//环排总角度
var cAg = eAg-sAg;

var startAngle = sAg-90;
var currAngle =startAngle;


var strLen = sealDept.length;
var setpAg = cAg/(strLen-1);


var elemTextArray = new Array(strLen);

var newText = null;

svgCanvas.getCurrentDrawing().createLayer("印章环排文字");

var currX = starX;
var currY = starY;

var rtu = new RtUtils();

var angleStep = cAg/(strLen-1);
var sa = 0;

var isCalcRing = false;

var arcLength  = rx*2*Math.PI;
var  arcLengthStep = arcLength/(strLen-1);
if(isCalcRing){
if(rx!=ry && rx>ry){
var rqt = rtu.findQt(ry/rx);
arcLength = rqt*(rx+ry);
arcLengthStep = arcLength/(strLen-1);
}
}



//添加一个测试圆形
/*
var test_eclipse = svgCanvas.addSvgElementFromJson({
 "element": "ellipse",
 "curStyles": true,
 "attr": {
"cx": starX+rx,
"cy": starY,
"rx": crx,
"ry": cry,
"id": svgCanvas.getNextId(),
"fill": 'none',
"stroke-width": 4,
"font-size": fontSize,
"font-family": '黑体',
"text-anchor": "start",
"xml:space": "preserve",
//"transform":trasForm,
"opacity": 1
 }
});
*/

for(var i=0;i<strLen;i++){

sa = i*angleStep;
if(isCalcRing && i>0){
if(rx!=ry && rx>ry){
sa = (i*arcLengthStep*cAg/arcLength);
}
}

if(isCalcRing && i>0){
var offsetX =  rx*Math.cos(2*Math.PI*arcLengthStep/360)/arcLengthStep;
var offsetY =  ry*Math.cos(2*Math.PI*arcLengthStep/360)/arcLengthStep;

//sa = sa*offsetX;
}


currAngle = startAngle+sa;

if(sAg<0){
sa += sAg;
}



var s1 = rx-rx*Math.cos(2*Math.PI*sa/360);
var s2 = ry*Math.sin(2*Math.PI*sa/360);




var currX = starX+s1;
var currY = starY-s2;


//var currX = starX+(i*fontSize);
//var currY = starY;

var trasX = currX;
var trasY = currY;



var trasForm = "rotate("+currAngle+","+trasX+","+trasY+")";
//var trasForm = "rotate(0)";
var isMatrix = false;



newText = svgCanvas.addSvgElementFromJson({
 "element": "text",
 "curStyles": true,
 "attr": {
"x": currX,
"y": currY,
"id": svgCanvas.getNextId(),
"fill": '#ff0000',
"stroke-width": 0,
"font-size": fontSize,
"font-family": '黑体',
"text-anchor": "start",
"xml:space": "preserve",
"transform":trasForm,
"opacity": 1
 }
});

elemTextArray[i] = newText;



var currChar = sealCharsArray[i];
newText.textContent = currChar;

svgCanvas.addToSelection([elemTextArray[i]]);
          //svgCanvas.moveToBottomSelectedElement();
//svgCanvas.selectorManager.requestSelector(elemTextArray[i]);

//svgCanvas.convertToGroup(elemTextArray[i]);


}


//svgCanvas.convertToGroup(elemTextArray[i]);
//multiselected = true;
//svgCanvas.selectedElements = elemTextArray;
svgCanvas.groupSelectedElements(); 
//svgCanvas.selectorManager.initGroup();


for(var i=0;i<strLen;i++){
//svgCanvas.selectorManager.requestSelector(elemTextArray[i]);
//svgCanvas.convertToGroup(elemTextArray[i]);

//svgCanvas.selectorManager.requestSelector(elemTextArray[i]).reset(elemTextArray[i])
          //svgCanvas.selectorManager.requestSelector(elemTextArray[i]).selectorRect.setAttribute("display", "none");

var elem = elemTextArray[i];
 if (elem == null) break;
 //svgCanvas.selectorManager.releaseSelector(elem);
 //svgCanvas.selectedElements[i] = null;


if(isMatrix){
//elemTextArray[i].transform += " matrix(1,0,0,2.407407522201538,0,-302.5926172733307)";
}
}

svgCanvas.clearSelection();


//svgCanvas.groupSelectedElements(); 

//模拟菜单 "组合" 单击事件 
//$('#tool_group').trigger("click");



//svgCanvas.setMode('select');

}

$('#tool_ring_text').click(function(){
//testRead("E:\\Work\\t1.txt");
//testDraw("这是一个测试!这是一个测试!这是一个测试!\r\n");

//return;

var hpText = $("#hpText").val();
if(hpText != ""){
drawRingText(hpText);
}else{
alert("请输入环排文字内容")
}
//drawRingText("这是");
//alert("测试!");
});
这里只是绘制环形文字的方法

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值