javascript - How to append arrow marker dynamically in line only using svg HTML5 -


https://jsfiddle.net/0hh4rkso/12/ tried. need append arrow marker in rectangle connecting lines.i need dynamically wrote javascript function given below. in middle of given size plotting rectangle , connected line element.but not able append arrow in line.some 1 please give solution.

var svg=function(h,w){             // fun create svg var svg=document.createelementns(ns,"svg");   svg.width=w;   svg.height=h;    return svg; } var rect=function(x,y,h,w){        // fun create rectangle    var rectsvgobj = document.createelementns(ns, 'rect');    rectsvgobj.setattributens(null, "id", "rectid");    rectsvgobj.setattributens(null, 'x',x);    rectsvgobj.setattributens(null, 'y', y);    rectsvgobj.setattributens(null, 'height', h);    rectsvgobj.setattributens(null, 'width', w);    rectsvgobj.setattributens(null, 'fill', 'none');    rectsvgobj.setattributens(null, "stroke", "black");   return rectsvgobj; } var arrow= function(){                   // fun arrow     var markerobj = document.createelementns(ns,"marker");   markerobj.setattributens(null, "id", "markerarrow1");      var arrowobj=document.createelementns(ns,"path");    arrowobj.setattributens(null, "id", "markerarrow");   arrowobj.setattributens(null, "d","m2,2 l2,13 l8,7 l2,2" );   markerobj.appendchild(arrowobj); return markerobj; } var lines= function(x1,y1,x2,y2){        // lines    var linesvgobj = document.createelementns(ns, 'line');    linesvgobj.setattributens(null, "id", "lineid");    linesvgobj.setattributens(null, 'x1',x1);    linesvgobj.setattributens(null, 'y1', y1);    linesvgobj.setattributens(null, 'x2', x2);    linesvgobj.setattributens(null, 'y2', y2);    linesvgobj.setattributens(null, "stroke", "blue");    linesvgobj.setattributens(null,'marker-mid',        'url(#markerarrow1)'); return linesvgobj; } var svg=svg(height,width);   document.body.appendchild(svg);      // append svg body  var markerarrw =arrow();   svg.appendchild(markerarrw);   x=cx; y=cy;    var r= rect(x,y,rheight,rwidth);       svg.appendchild(r);                 // append rect1 svg   // input rects plote var lx2=arrowpoint_x; var ly2=arrowpoint_y; var irect_x=0; var irect_y=0; for(var i=1;i<=limit;i++){         // append inputs rect+line     irect_x=cx-(cx/2);     irect_y=cy;  if (i%2== 0){      irect_y=(irect_y-(irh*i))+20;    }else{        irect_y= (irect_y+(irh*i))-20;   }        var irect= rect(irect_x,irect_y,irh,irw);     svg.appendchild(irect);       var lx1=irect_x+irw;     var ly1=irect_y+(irh/2);     var l=lines(lx1,ly1,lx2,ly2);     svg.appendchild(l);    }

following example given svg marker. if add in defs sections , reference later works. i've updated fiddle code but, not see if set marker-mid, marker-start & marker-end seem work.

https://jsfiddle.net/0hh4rkso/10/


Comments

Post a Comment

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

this code i'm using find latitude , longitude of place: function coords($address){ echo $url="http://maps.googleapis.com/maps/api/geocode/json?address=".$address; $json = file_get_contents(urlencode($url)); $data = json_decode($json, true); print_r($data['results'][0]['geometry']['location']['lat']); print_r($data['results'][0]['geometry']['location']['lng']); } however returns warning: failed open stream: http request failed! http/1.0 400 bad request if use above code in simple procedure works fine not in function. note: have tried curl_init()... method produced same result? instead of encoding whole url encode address part. following code work fine $add='jamshoro phase 2'; $url="http://maps.googleapis.com/maps/api/geocode/json?address=".urlencode($add); $json = file_get_contents($url); $data = json_decode($json, true); print_r($data['r
Read more

java - How to filter a backspace keyboard input -

i have code gives message when key number pressed: txtvalueofclause.addeventfilter(keyevent.key_typed, new eventhandler<keyevent>() { @override public void handle(keyevent t) { char ar[] = t.getcharacter().tochararray(); char ch = ar[t.getcharacter().tochararray().length - 1]; if (!(ch >= '0' && ch <= '9')) { system.out.println("the char entered not number"); t.consume(); } } }); now if press on wrong button , press backspace remove it, error message. how can add backspace input if statement? i have found answer: txtvalueofclause.addeventfilter(keyevent.key_typed, new eventhandler<keyevent>() { @override public void handle(keyevent t) { char ar[] = t.getcharacter().tochararray(); char ch = ar[t.getcharacter().tochar
Read more

java - Show Soft Keyboard when EditText Appears -

i have code in android app, alert dialog , keyboard, , when dialog shown want keyboard appear. not , not sure why? here code: final alertdialog.builder alert = new alertdialog.builder(this); alert.settitle("title"); alert.setmessage("message"); final edittext input = new edittext(this); input.setinputtype(inputtype.type_class_number); alert.setview(input); input.setonfocuschangelistener(new view.onfocuschangelistener() { @override public void onfocuschange(view v, boolean hasfocus) { if (hasfocus) { log.i(tag, "in focus"); inputmethodmanager inputmethodmanager = (inputmethodmanager) getsystemservice(context.input_method_service); inputmethodmanager.showsoftinput(input, inputmethodmanager.show_implicit); } } }); but keyboard not appear though edit text in focus, , tell appear why, doesn't come up? thanks in advance.
Read more