Proper way to crop an SVG? -

-

i'm totally baffled svg images. want crop image core content. want crop specifying viewbox and/or viewport and/or else except not want change of points in polyline elements. image as-is renders this. (note border illustration purposes. border not part of svg.)

original

and want crop looks this. (note border again illustration purposes only)

cropped

given svg xml how crop it?

<?xml version="1.0" encoding="utf-8"?> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" >     <polyline points="39,340  42,338  47,333  54,322  68,308  83,292  91,277  100,259  106" style="fill:none;stroke:black;stroke-width:3"/>     <polyline points="71,299  82,303  95,304  109,302  120,301" style="fill:none;stroke:black;stroke-width:3"/>     <polyline points="212,275  228,254  233,233  240,208  239,246  188,278  174,306  158,334  149,351  144,358  140,362  139,362  139,340  179,313  186" style="fill:none;stroke:black;stroke-width:3"/>     <polyline points="169,345  174,347  227,333  231,330  330,371  328,374  414,209  410,192  404,183  401,177  398,177  395,179   379,340  385,384  397,414" style="fill:none;stroke:black;stroke-width:3"/> </svg>

when svg inline, can compute viewbox using getbbox() root svg.

below example polylines:

<!doctype html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>compute viewbox</title> <meta http-equiv="content-type" content="text/html; charset=utf-8"> </head> <body> <center> <h3>compute viewbox</h3> <div id=svgdiv style='background-color:lightgreen'> <svg id=mysvg>     <polyline points="39,340  42,338  47,333  54,322  68,308  83,292  91,277  100,259" style="fill:none;stroke:black;stroke-width:3"/>     <polyline points="71,299  82,303  95,304  109,302  120,301" style="fill:none;stroke:black;stroke-width:3"/>     <polyline points="212,275  228,254  233,233  240,208  239,246  188,278  174,306  158,334  149,351  144,358  140,362  139,362  139,340  179,313  " style="fill:none;stroke:black;stroke-width:3"/>     <polyline points="169,345  174,347  227,333  231,330  330,371  328,374  414,209  410,192  404,183  401,177  398,177  395,179   379,340  385,384  397,414" style="fill:none;stroke:black;stroke-width:3"/> </svg> </div> <button onclick=fit()>fit</button> viewvox:<input type=text size=20 id=vbvalue /> </center> </body> <script>  //---button-- function fit() {     var bb=mysvg.getbbox()     var bbx=bb.x     var bby=bb.y     var bbw=bb.width     var bbh=bb.height     var vb=[bbx,bby,bbw,bbh]     mysvg.setattribute("viewbox", vb.join(" ") )     vbvalue.value=vb.join(" ")     svgdiv.style.width=bbw+"px"     svgdiv.style.height=bbh+"px" } </script> </html>

Comments

Post a Comment

Popular posts from this blog

java - WrongTypeOfReturnValue exception thrown when unit testing using mockito -

-
my test list<person> mylist; @test public void testisvalidperson() { mylist = new arraylist<person>(); mylist.add(new person("tom")); when(persondao.get(person)).thenreturn(mylist); when((persondao.get(person)).isempty()).thenreturn(false);//------exception thrown boolean result = service.isvalid("tom"); assertfalse(result); } method tested: public boolean isvalid(string person){ persondao = new persondao(); person personobj = new person(person); return (persondao.get(person).isempty())?false : true; } exception thrown: org.mockito.exceptions.misusing.wrongtypeofreturnvalue: boolean cannot returned get() get() should return list *** if you're unsure why you're getting above error read on. due nature of syntax above problem might occur because: 1. exception *might* occur in wrongly written multi-threaded tests. please refer mockito faq on limitations of concurrency testing. 2. sp
Read more

php - Magento - Deleted Base url key -

-
i working on cleaning url: http://mydomain.com/shop/shop/deals i going through settings in configuration tab in admin panel on magento , change secure , unsecure base urls remove first base url "shop" web page read: http://mydomain.com/shop/deals so changed unsecure base urls mydomain.com/shop mydomain.com , secure 12.345.67.89/shop 12.345.67.89. wrong thing do. i cannot reload page or admin console. how access these files through ftp , change correctly there?? when make changes in admin panel changes made in database not in file. have make changes in database. 1.go database , select core_config_data table under table find web/unsecure/base_url , web/secure/base_url . make changes here. don't forget clear cache in var/cache folder
Read more

android - How to disable Button if EditText is empty ? -

-
i have edittext , button in application. when button clicked,the text entered in edittext added listview. i want disable button if edittext empty.how ? this code button click imagebutton imb=(imagebutton)findviewbyid(r.id.btn_send); imb.setonclicklistener(new onclicklistener() { @override public void onclick(view arg0) { edittext et = (edittext)findviewbyid(r.id.edittext1); string str = et.gettext().tostring(); web1.add(str); toast.maketext(shoutsingleprogram.this, "you entered...."+str, toast.length_short).show(); adapter1.notifydatasetchanged(); et.settext(""); } }); } how can ? edittext1.addtextchangedlistener(new textwatcher() { @override public void ontextchanged(charsequence s, int start, int before, in
Read more