jquery svg - Clip-path and transform combination in svg -


please refer following clip-path in group.

<g id="container_svg_seriescollection" clip-path="url(#container_svg_chartareacliprect)"><defs> <clippath id="container_svg_chartareacliprect"> <rect id="container_svg_chartareacliprect" x="128.8" y="20" width="651.2" height="415" fill="white" stroke-width="1" stroke="gray"/> </clippath> </defs> <g id="container_svg_symbolgroup_0" transform="translate(128.8,435)" clip-path="url(#container_svg_chartareacliprect)"> <circle id="container_svg_circlesymbol_3_0" cx="86.8" cy="-25.875" r="7.0710678118654755" fill="url(#container_svg_symbol0gradient)" stroke-width="1" stroke="gray"/><circle id="container_svg_circlesymbol_4_0" cx="108.5" cy="-155.25" r="7.0710678118654755" fill="url(#container_svg_symbol0gradient)" stroke-width="1" stroke="gray"/></g> </g> </g>

group id -> "container_svg_symbolgroup1_0 (i.e circle symbol) not visible when remove clip-path visible in chart.

what problem? why transform , clip-path not working in cases?

how can show circle symbol above clip-path?

you have nested clip paths, reusing same twice. remove inner clip path, , works.

(wrapped in svg document):

<svg version="1.1"      baseprofile="full"      xmlns="http://www.w3.org/2000/svg"      xmlns:xlink="http://www.w3.org/1999/xlink"      xmlns:ev="http://www.w3.org/2001/xml-events">     <g id="container_svg_seriescollection" clip-path="url(#container_svg_chartareacliprect)">         <defs>             <clippath id="container_svg_chartareacliprect">                 <rect id="container_svg_chartareacliprect" x="128.8" y="20" width="651.2" height="415" fill="white" stroke-width="1" stroke="gray"/>             </clippath>         </defs>         <g id="container_svg_symbolgroup_0" transform="translate(128.8,435)">             <circle id="container_svg_circlesymbol_3_0" cx="86.8" cy="-25.875" r="7.0710678118654755" fill="url(#container_svg_symbol0gradient)" stroke-width="1" stroke="gray"/>             <circle id="container_svg_circlesymbol_4_0" cx="108.5" cy="-155.25" r="7.0710678118654755" fill="url(#container_svg_symbol0gradient)" stroke-width="1" stroke="gray"/>         </g>     </g> </svg>

also, remove id="container_svg_chartareacliprect" rect inside clippath


Comments

Post a Comment

Popular posts from this blog

c# - Operator '==' incompatible with operand types 'Guid' and 'Guid' using DynamicExpression.ParseLambda<T, bool> -

i'm using dynamic linq library , there source code , basic docu , nuget version pm> install-package dynamiclinq i'm trying construct clause involves guids i have tried string "id == @0" . parameter array object[] value ( guid xxxx ) var whereclausesb = buildlogicalkeywhereclause2(entity, logicalkey); //build string var parms = buildparamarray(entity, logicalkey); // object[] var wherelambda = ofsi.bos.core.dynamicexpression.parselambda<t, bool>(whereclausesb.tostring(),parms); //parse an exception thrown in dynamicexpression.parselambda operator '==' incompatible operand types 'guid' , 'guid' i have tried guid , string.(fail) i tried , "id = @0" (fail). string == string works, int32==int32 not guid == guid not any ideas? try using equals method instead of == operator in string: "id.equals(@0)"
Read more