Beefy Boxes and Bandwidth Generously Provided by pair Networks
Pathologically Eclectic Rubbish Lister
 
PerlMonks  

Re: [OT] Displaying 4D data ... (Quick SVG Sketch)

by luis.roca (Deacon)
on Dec 09, 2011 at 15:58 UTC ( #942688=note: print w/ replies, xml ) Need Help??


in reply to [OT] Displaying 4D data in a 2D image.

BrowserUK,
I may not be understanding this correctly but why not have the cone itself represent change in frequencies (or an illustration of overlapping cones) with HSV dots/circles positioned according to it's width(?). This is one of those cases where it's easier and faster for me to draw what I'm thinking of so here goes:

Note: SVG output using Illustrator so please forgive the bloated markup :)

<?xml version="1.0" encoding="iso-8859-1"?> <!-- Generator: Adobe Illustrator 15.0.2, SVG Export Plug-In . SVG Ver +sion: 6.00 Build 0) --> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN" "http://www.w3.or +g/Graphics/SVG/1.1/DTD/svg11-basic.dtd"> <svg version="1.1" baseProfile="basic" xmlns="http://www.w3.org/2000/s +vg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="612px" height="792px" viewBox="0 0 612 792" xml:sp +ace="preserve"> <g id="Layer_1"> <g> <radialGradient id="SVGID_1_" cx="319" cy="471" r="273.0018" g +radientUnits="userSpaceOnUse"> <stop offset="0" style="stop-color:#FFFFFF"/> <stop offset="0.1497" style="stop-color:#FBFBFB"/> <stop offset="0.3049" style="stop-color:#EEEEEF"/> <stop offset="0.4627" style="stop-color:#DADADA"/> <stop offset="0.6223" style="stop-color:#BDBDBE"/> <stop offset="0.7831" style="stop-color:#979899"/> <stop offset="0.9431" style="stop-color:#6A6B6D"/> <stop offset="1" style="stop-color:#58595B"/> </radialGradient> <rect x="18" y="18" style="opacity:0.2;fill:url(#SVGID_1_);" w +idth="576" height="756"/> </g> <g style="opacity:0.4;"> <radialGradient id="SVGID_2_" cx="306.001" cy="396" r="256.044 +7" gradientUnits="userSpaceOnUse"> <stop offset="0" style="stop-color:#FFFFFF"/> <stop offset="0.3978" style="stop-color:#FBFBFB"/> <stop offset="0.8093" style="stop-color:#EEEFF0"/> <stop offset="1" style="stop-color:#E6E7E8"/> </radialGradient> <path style="fill:url(#SVGID_2_);" d="M306,685.5c-0.611,0-1.16 +1-0.371-1.391-0.938L88.608,150.432 c-0.311-0.768,0.06-1.642,0.828-1.953C158.25,120.624,231.11 +3,106.5,306,106.5s147.75,14.124,216.566,41.98 c0.768,0.311,1.139,1.185,0.828,1.953l-216.003,534.13C307.1 +62,685.129,306.612,685.5,306,685.5z"/> <path style="fill:#F1F2F2;" d="M306,108c76.386,0,149.298,14.86 +9,216.003,41.87L306,684L89.999,149.87 C156.703,122.869,229.615,108,306,108 M306,105c-75.081,0-14 +8.133,14.161-217.127,42.089c-1.536,0.622-2.277,2.37-1.656,3.905 l216.002,534.131c0.458,1.133,1.559,1.875,2.781,1.875c1.222 +,0,2.323-0.742,2.781-1.875l216.004-534.13 c0.621-1.536-0.12-3.284-1.655-3.905C454.135,119.161,381.08 +2,105,306,105L306,105z"/> </g> <g style="opacity:0.4;"> <radialGradient id="SVGID_3_" cx="306" cy="421.6689" r="23 +3.3558" gradientTransform="matrix(1 0 0 1.5 0 -210.8345)" gradientUni +ts="userSpaceOnUse"> <stop offset="0" style="stop-color:#FFFFFF"/> <stop offset="0.2396" style="stop-color:#FBFBFB"/> <stop offset="0.4878" style="stop-color:#EEEFEF"/> <stop offset="0.7399" style="stop-color:#DADBDC"/> <stop offset="0.9934" style="stop-color:#BDBFC1"/> <stop offset="1" style="stop-color:#BCBEC0"/> </radialGradient> <path style="fill:url(#SVGID_3_);" d="M306,685.5c-0.611,0-1.16 +2-0.371-1.391-0.938L107.86,198.039 c-0.311-0.768,0.06-1.642,0.828-1.953c62.699-25.379,129.084 +-38.248,197.313-38.248c68.23,0,134.616,12.869,197.312,38.248 c0.769,0.311,1.139,1.185,0.828,1.953l-196.75,486.523C307.1 +62,685.129,306.612,685.5,306,685.5z"/> <path style="fill:#F1F2F2;" d="M306,159.338c69.578,0,135.992,1 +3.544,196.75,38.139L306,684L109.25,197.477 C170.009,172.882,236.423,159.338,306,159.338 M306,156.338c +-68.423,0-134.998,12.905-197.875,38.357 c-1.536,0.622-2.277,2.37-1.656,3.905l196.75,486.524c0.458, +1.133,1.559,1.875,2.781,1.875c1.222,0,2.323-0.742,2.781-1.875 l196.75-486.523c0.621-1.536-0.12-3.284-1.655-3.905C440.999 +,169.244,374.424,156.338,306,156.338L306,156.338z"/> </g> <g style="opacity:0.4;"> <radialGradient id="SVGID_4_" cx="306" cy="458.0791" r="20 +1.1735" gradientTransform="matrix(1 0 0 1.5 0 -229.0396)" gradientUni +ts="userSpaceOnUse"> <stop offset="0" style="stop-color:#FFFFFF"/> <stop offset="0.2082" style="stop-color:#FBFBFB"/> <stop offset="0.424" style="stop-color:#EEEFEF"/> <stop offset="0.6432" style="stop-color:#DADBDC"/> <stop offset="0.8633" style="stop-color:#BDBEC1"/> <stop offset="1" style="stop-color:#A7A9AC"/> </radialGradient> <path style="fill:url(#SVGID_4_);" d="M306,685.5c-0.611,0-1.16 +2-0.371-1.391-0.938L135.167,265.565 c-0.311-0.768,0.06-1.642,0.828-1.953c54.021-21.867,111.219 +-32.954,170.005-32.954c58.787,0,115.985,11.087,170.004,32.955 c0.768,0.311,1.139,1.185,0.828,1.953L307.391,684.562C307.1 +62,685.129,306.612,685.5,306,685.5z"/> <path style="fill:#F1F2F2;" d="M306,232.158c59.919,0,117.117,1 +1.664,169.442,32.845L306,684L136.558,265.002 C188.884,243.822,246.081,232.158,306,232.158 M306,229.158c +-58.98,0-116.367,11.125-170.568,33.064 c-1.536,0.622-2.277,2.37-1.656,3.905l169.442,418.998c0.458 +,1.133,1.559,1.875,2.781,1.875c1.222,0,2.323-0.742,2.781-1.875 l169.442-418.998c0.621-1.536-0.12-3.284-1.655-3.905C422.36 +8,240.282,364.981,229.158,306,229.158L306,229.158z"/> </g> <g style="opacity:0.4;"> <radialGradient id="SVGID_5_" cx="307.0127" cy="685.3555" +r="137.1456" gradientTransform="matrix(1 0 0 2.1186 0 -766.6304)" gra +dientUnits="userSpaceOnUse"> <stop offset="0" style="stop-color:#FFFFFF"/> <stop offset="0.1874" style="stop-color:#FBFBFB"/> <stop offset="0.3816" style="stop-color:#EEEFEF"/> <stop offset="0.5789" style="stop-color:#DADADB"/> <stop offset="0.7784" style="stop-color:#BDBEC0"/> <stop offset="0.9778" style="stop-color:#989A9C"/> <stop offset="1" style="stop-color:#939598"/> </radialGradient> <path style="fill:url(#SVGID_5_);" d="M306,685.5c-0.611,0-1.16 +2-0.371-1.391-0.938L188.251,396.831 c-0.311-0.768,0.06-1.642,0.828-1.953c37.154-15.039,76.492- +22.665,116.921-22.665c40.43,0,79.767,7.625,116.919,22.665 c0.768,0.311,1.139,1.185,0.828,1.953L307.391,684.562C307.1 +62,685.129,306.612,685.5,306,685.5z"/> <path style="fill:#E6E7E8;" d="M306,373.713c41.148,0,80.425,8. +01,116.357,22.556L306,684L189.642,396.269 C225.575,381.724,264.852,373.713,306,373.713 M306,370.713c +-40.623,0-80.15,7.663-117.484,22.774 c-1.536,0.622-2.277,2.37-1.656,3.906l116.358,287.731c0.458 +,1.133,1.559,1.875,2.781,1.875c1.222,0,2.323-0.742,2.781-1.875 l116.357-287.731c0.621-1.535-0.12-3.284-1.655-3.905C386.15 +1,378.376,346.624,370.713,306,370.713L306,370.713z"/> </g> <g> <path style="fill:#27AAE1;" d="M311.4,446.9c-2.15,0-3.9-1.75-3 +.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S313.551,446.9,311.4,446.9z"/> <path style="fill:#FFFFFF;" d="M311.4,440.1c1.6,0,2.9,1.301,2. +9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S309.801,440.1,311.4,440.1 M311.4,438.1c-2.706,0-4.9,2.194 +-4.9,4.9c0,2.707,2.194,4.9,4.9,4.9c2.707,0,4.9-2.193,4.9-4.9 C316.301,440.294,314.107,438.1,311.4,438.1L311.4,438.1z"/> </g> <g id="Layer_2"> </g> </g> <g id="Layer_4"> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="0" x2="630" y2="0"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="9" x2="630" y2="9"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="18" x2="630" y2="18"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="27" x2="630" y2="27"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="36" x2="630" y2="36"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="45" x2="630" y2="45"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="54" x2="630" y2="54"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="63" x2="630" y2="63"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="72" x2="630" y2="72"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="81" x2="630" y2="81"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="90" x2="630" y2="90"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="99" x2="630" y2="99"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="108" x2="630" y2="108"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="117" x2="630" y2="117"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="126" x2="630" y2="126"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="135" x2="630" y2="135"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="144" x2="630" y2="144"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="153" x2="630" y2="153"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="162" x2="630" y2="162"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="171" x2="630" y2="171"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="180" x2="630" y2="180"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="189" x2="630" y2="189"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="198" x2="630" y2="198"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="207" x2="630" y2="207"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="216" x2="630" y2="216"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="225" x2="630" y2="225"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="234" x2="630" y2="234"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="243" x2="630" y2="243"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="252" x2="630" y2="252"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="261" x2="630" y2="261"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="270" x2="630" y2="270"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="279" x2="630" y2="279"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="288" x2="630" y2="288"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="297" x2="630" y2="297"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="306" x2="630" y2="306"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="315" x2="630" y2="315"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="324" x2="630" y2="324"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="333" x2="630" y2="333"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="342" x2="630" y2="342"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="351" x2="630" y2="351"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="360" x2="630" y2="360"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="369" x2="630" y2="369"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="378" x2="630" y2="378"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="387" x2="630" y2="387"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="396" x2="630" y2="396"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="405" x2="630" y2="405"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="414" x2="630" y2="414"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="423" x2="630" y2="423"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="432" x2="630" y2="432"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="441" x2="630" y2="441"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="450" x2="630" y2="450"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="459" x2="630" y2="459"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="468" x2="630" y2="468"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="477" x2="630" y2="477"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="486" x2="630" y2="486"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="495" x2="630" y2="495"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="504" x2="630" y2="504"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="513" x2="630" y2="513"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="522" x2="630" y2="522"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="531" x2="630" y2="531"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="540" x2="630" y2="540"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="549" x2="630" y2="549"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="558" x2="630" y2="558"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="567" x2="630" y2="567"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="576" x2="630" y2="576"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="585" x2="630" y2="585"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="594" x2="630" y2="594"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="603" x2="630" y2="603"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="612" x2="630" y2="612"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="621" x2="630" y2="621"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="630" x2="630" y2="630"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="639" x2="630" y2="639"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="648" x2="630" y2="648"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="657" x2="630" y2="657"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="666" x2="630" y2="666"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="675" x2="630" y2="675"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="684" x2="630" y2="684"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="693" x2="630" y2="693"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="702" x2="630" y2="702"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="711" x2="630" y2="711"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="720" x2="630" y2="720"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="729" x2="630" y2="729"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="738" x2="630" y2="738"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="747" x2="630" y2="747"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="756" x2="630" y2="756"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="765" x2="630" y2="765"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="774" x2="630" y2="774"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="783" x2="630" y2="783"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="792" x2="630" y2="792"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="-31" y1="801" x2="630" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="10" y1="-10" x2="10" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="18" y1="-10" x2="18" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="26" y1="-10" x2="26" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="34" y1="-10" x2="34" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="42" y1="-10" x2="42" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="50" y1="-10" x2="50" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="58" y1="-10" x2="58" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="66" y1="-10" x2="66" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="74" y1="-10" x2="74" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="82" y1="-10" x2="82" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="90" y1="-10" x2="90" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="98" y1="-10" x2="98" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="106" y1="-10" x2="106" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="114" y1="-10" x2="114" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="122" y1="-10" x2="122" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="130" y1="-10" x2="130" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="138" y1="-10" x2="138" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="146" y1="-10" x2="146" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="154" y1="-10" x2="154" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="162" y1="-10" x2="162" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="170" y1="-10" x2="170" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="178" y1="-10" x2="178" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="186" y1="-10" x2="186" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="194" y1="-10" x2="194" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="202" y1="-10" x2="202" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="210" y1="-10" x2="210" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="218" y1="-10" x2="218" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="226" y1="-10" x2="226" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="234" y1="-10" x2="234" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="242" y1="-10" x2="242" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="250" y1="-10" x2="250" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="258" y1="-10" x2="258" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="266" y1="-10" x2="266" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="274" y1="-10" x2="274" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="282" y1="-10" x2="282" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="290" y1="-10" x2="290" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="298" y1="-10" x2="298" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="306" y1="-10" x2="306" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="314" y1="-10" x2="314" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="322" y1="-10" x2="322" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="330" y1="-10" x2="330" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="338" y1="-10" x2="338" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="346" y1="-10" x2="346" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="354" y1="-10" x2="354" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="362" y1="-10" x2="362" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="370" y1="-10" x2="370" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="378" y1="-10" x2="378" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="386" y1="-10" x2="386" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="394" y1="-10" x2="394" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="402" y1="-10" x2="402" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="410" y1="-10" x2="410" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="418" y1="-10" x2="418" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="426" y1="-10" x2="426" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="434" y1="-10" x2="434" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="442" y1="-10" x2="442" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="450" y1="-10" x2="450" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="458" y1="-10" x2="458" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="466" y1="-10" x2="466" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="474" y1="-10" x2="474" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="482" y1="-10" x2="482" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="490" y1="-10" x2="490" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="498" y1="-10" x2="498" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="506" y1="-10" x2="506" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="514" y1="-10" x2="514" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="522" y1="-10" x2="522" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="530" y1="-10" x2="530" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="538" y1="-10" x2="538" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="546" y1="-10" x2="546" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="554" y1="-10" x2="554" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="562" y1="-10" x2="562" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="570" y1="-10" x2="570" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="578" y1="-10" x2="578" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="586" y1="-10" x2="586" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="594" y1="-10" x2="594" y2="801"/> <line style="fill:none;stroke:#FFFFFF;stroke-width:0.5;stroke-mite +rlimit:10;" x1="602" y1="-10" x2="602" y2="801"/> </g> <g id="Layer_3"> <g> <path style="fill:#D7DF23;" d="M225,203.9c-2.151,0-3.9-1.75-3. +9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9S227.151,203.9,225,203.9z "/> <path style="fill:#FFFFFF;" d="M225,197.1c1.599,0,2.9,1.301,2. +9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S223.401,197.1,225,197.1 M225,195.1c-2.706,0-4.9,2.194-4.9 +,4.9c0,2.707,2.194,4.9,4.9,4.9c2.707,0,4.9-2.193,4.9-4.9 C229.9,197.294,227.707,195.1,225,195.1L225,195.1z"/> </g> <g> <path style="fill:#27AAE1;" d="M316.65,112.25c-2.15,0-3.9-1.75 +-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S318.801,112.25,316.65,112.25z"/> <path style="fill:#FFFFFF;" d="M316.65,105.449c1.6,0,2.9,1.301 +,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S315.051,105.449,316.65,105.449 M316.65,103.449c-2.706,0-4 +.9,2.194-4.9,4.9c0,2.707,2.194,4.9,4.9,4.9 c2.707,0,4.9-2.193,4.9-4.9C321.551,105.644,319.357,103.449 +,316.65,103.449L316.65,103.449z"/> </g> <g> <path style="fill:#F15A29;" d="M342,132.9c-2.15,0-3.9-1.75-3.9 +-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9S344.15,132.9,342,132.9z" /> <path style="fill:#FFFFFF;" d="M342,126.1c1.6,0,2.9,1.301,2.9, +2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9S340.4,126.1,342,126.1 M342,124.1c-2.706,0-4.9,2.194-4.9,4.9c0,2.707,2.194,4.9,4 +.9,4.9c2.707,0,4.9-2.193,4.9-4.9 C346.9,126.294,344.707,124.1,342,124.1L342,124.1z"/> </g> <g> <path style="fill:#F15A29;" d="M296.527,415.769c-2.151,0-3.9-1 +.75-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S298.678,415.769,296.527,415.769z"/> <path style="fill:#FFFFFF;" d="M296.527,408.968c1.599,0,2.9,1. +301,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S294.928,408.968,296.527,408.968 M296.527,406.968c-2.706,0 +-4.9,2.194-4.9,4.9c0,2.707,2.194,4.9,4.9,4.9 c2.707,0,4.9-2.193,4.9-4.9C301.428,409.162,299.234,406.968 +,296.527,406.968L296.527,406.968z"/> </g> <g> <path style="fill:#F15A29;" d="M291.627,442c-2.151,0-3.9-1.75- +3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S293.778,442,291.627,442z"/> <path style="fill:#FFFFFF;" d="M291.627,435.199c1.599,0,2.9,1. +301,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S290.028,435.199,291.627,435.199 M291.627,433.199c-2.706,0 +-4.9,2.194-4.9,4.9c0,2.707,2.194,4.9,4.9,4.9 c2.707,0,4.9-2.193,4.9-4.9C296.527,435.394,294.334,433.199 +,291.627,433.199L291.627,433.199z"/> </g> <g> <path style="fill:#27AAE1;" d="M339.314,450.34c-0.635,0-1.269- +0.159-1.833-0.46c-1.896-1.014-2.616-3.381-1.604-5.278 c0.681-1.273,2-2.064,3.445-2.064c0.634,0,1.268,0.159,1.833 +,0.461c0.919,0.49,1.592,1.31,1.896,2.307 c0.303,0.997,0.2,2.052-0.29,2.971C342.08,449.549,340.76,45 +0.34,339.314,450.34C339.315,450.34,339.315,450.34,339.314,450.34z" /> <path style="fill:#FFFFFF;" d="M339.322,443.537c0.477,0,0.936, +0.115,1.362,0.344c0.684,0.364,1.184,0.974,1.409,1.715 s0.148,1.525-0.216,2.208c-0.506,0.948-1.487,1.536-2.563,1. +536c-0.478,0-0.936-0.115-1.361-0.342 c-1.411-0.754-1.946-2.515-1.193-3.925C337.266,444.126,338. +247,443.537,339.322,443.537 M339.322,441.537 c-1.751,0-3.444,0.941-4.327,2.594c-1.274,2.388-0.372,5.355 +,2.016,6.631c0.735,0.393,1.525,0.578,2.304,0.578 c1.752,0,3.445-0.94,4.328-2.594c1.273-2.387,0.371-5.356-2. +017-6.63C340.891,441.724,340.101,441.537,339.322,441.537 L339.322,441.537z"/> </g> <g> <path style="fill:#27AAE1;" d="M318.483,433.664c-0.635,0-1.269 +-0.16-1.833-0.461c-0.92-0.49-1.594-1.31-1.896-2.306 c-0.303-0.997-0.199-2.052,0.291-2.972c0.681-1.273,2-2.064, +3.445-2.064c0.634,0,1.268,0.16,1.833,0.461 c0.919,0.49,1.591,1.31,1.895,2.306c0.303,0.997,0.199,2.053 +-0.291,2.972C321.247,432.873,319.928,433.664,318.483,433.664 C318.483,433.664,318.484,433.664,318.483,433.664z"/> <path style="fill:#FFFFFF;" d="M318.49,426.861c0.478,0,0.936,0 +.116,1.362,0.344c0.683,0.364,1.183,0.973,1.408,1.714 s0.148,1.526-0.217,2.21c-0.505,0.946-1.486,1.535-2.561,1.5 +35c-0.478,0-0.936-0.116-1.363-0.344 c-0.684-0.364-1.184-0.974-1.409-1.714c-0.226-0.741-0.148-1 +.526,0.217-2.209C316.433,427.45,317.415,426.861,318.49,426.861 M318.49,424.861c-1.752,0-3.445,0.941-4.327,2.594c-1.274,2 +.388-0.373,5.356,2.017,6.63c0.735,0.393,1.525,0.579,2.304,0.579 c1.751,0,3.443-0.94,4.325-2.594c1.274-2.388,0.372-5.356-2. +015-6.63C320.059,425.048,319.269,424.861,318.49,424.861 L318.49,424.861z"/> </g> <g> <path style="fill:#27AAE1;" d="M276.926,415.769c-2.151,0-3.9-1 +.75-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S279.077,415.769,276.926,415.769z"/> <path style="fill:#FFFFFF;" d="M276.926,408.968c1.599,0,2.9,1. +301,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S275.327,408.968,276.926,408.968 M276.926,406.968c-2.706,0 +-4.9,2.194-4.9,4.9c0,2.707,2.194,4.9,4.9,4.9 c2.707,0,4.9-2.193,4.9-4.9C281.826,409.162,279.633,406.968 +,276.926,406.968L276.926,406.968z"/> </g> <g> <path style="fill:#F15A29;" d="M281.827,335.56c-2.151,0-3.9-1. +75-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S283.978,335.56,281.827,335.56z"/> <path style="fill:#FFFFFF;" d="M281.827,328.759c1.599,0,2.9,1. +301,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S280.228,328.759,281.827,328.759 M281.827,326.759c-2.707,0 +-4.9,2.194-4.9,4.9c0,2.707,2.193,4.9,4.9,4.9s4.9-2.193,4.9-4.9 C286.727,328.953,284.534,326.759,281.827,326.759L281.827,3 +26.759z"/> </g> <g> <path style="fill:#27AAE1;" d="M380.861,340.46c-2.15,0-3.9-1.7 +5-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S383.012,340.46,380.861,340.46z"/> <path style="fill:#FFFFFF;" d="M380.861,333.659c1.6,0,2.9,1.30 +1,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S379.262,333.659,380.861,333.659 M380.861,331.659c-2.707,0 +-4.9,2.194-4.9,4.9c0,2.707,2.193,4.9,4.9,4.9s4.9-2.193,4.9-4.9 C385.762,333.854,383.568,331.659,380.861,331.659L380.861,3 +31.659z"/> </g> <g> <path style="fill:#D7DF23;" d="M380.861,316.732c-2.15,0-3.9-1. +75-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S383.012,316.732,380.861,316.732z"/> <path style="fill:#FFFFFF;" d="M380.861,309.932c1.6,0,2.9,1.30 +1,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S379.262,309.932,380.861,309.932 M380.861,307.932c-2.707,0 +-4.9,2.194-4.9,4.9c0,2.707,2.193,4.9,4.9,4.9s4.9-2.193,4.9-4.9 C385.762,310.126,383.568,307.932,380.861,307.932L380.861,3 +07.932z"/> </g> <g> <path style="fill:#27AAE1;" d="M371.06,293.779c-2.15,0-3.9-1.7 +5-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S373.21,293.779,371.06,293.779z"/> <path style="fill:#FFFFFF;" d="M371.06,286.979c1.6,0,2.9,1.301 +,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S369.46,286.979,371.06,286.979 M371.06,284.979c-2.707,0-4. +9,2.194-4.9,4.9c0,2.707,2.193,4.9,4.9,4.9s4.9-2.193,4.9-4.9 C375.96,287.173,373.767,284.979,371.06,284.979L371.06,284. +979z"/> </g> <g> <path style="fill:#F15A29;" d="M380.86,288.879c-2.15,0-3.9-1.7 +5-3.9-3.9s1.75-3.9,3.9-3.9s3.9,1.75,3.9,3.9 S383.011,288.879,380.86,288.879z"/> <path style="fill:#FFFFFF;" d="M380.86,282.078c1.6,0,2.9,1.301 +,2.9,2.9s-1.301,2.9-2.9,2.9s-2.9-1.301-2.9-2.9 S379.261,282.078,380.86,282.078 M380.86,280.078c-2.707,0-4 +.9,2.194-4.9,4.9c0,2.707,2.193,4.9,4.9,4.9s4.9-2.193,4.9-4.9 C385.761,282.272,383.567,280.078,380.86,280.078L380.86,280 +.078z"/> </g> <g> <path style="fill:#D7DF23;" d="M306.504,626.049c-1.244,0-2.385 +-0.57-3.128-1.566c-1.287-1.723-0.933-4.172,0.791-5.46 c0.679-0.507,1.485-0.775,2.331-0.775c1.244,0,2.384,0.571,3 +.127,1.566c0.625,0.836,0.886,1.862,0.737,2.894 c-0.149,1.031-0.691,1.942-1.526,2.566C308.155,625.78,307.3 +49,626.049,306.504,626.049 C306.504,626.049,306.504,626.049,306.504,626.049z"/> <path style="fill:#FFFFFF;" d="M306.497,619.247c0.926,0,1.773, +0.425,2.327,1.166c0.464,0.621,0.658,1.385,0.547,2.15 c-0.111,0.767-0.514,1.444-1.134,1.908c-0.506,0.378-1.105,0 +.577-1.733,0.577c-0.926,0-1.774-0.425-2.327-1.165 c-0.958-1.281-0.693-3.103,0.588-4.06C305.27,619.446,305.86 +9,619.247,306.497,619.247 M306.497,617.247 c-1.021,0-2.049,0.317-2.929,0.975c-2.169,1.62-2.614,4.69-0 +.994,6.859c0.962,1.288,2.437,1.968,3.93,1.968 c1.021,0,2.049-0.317,2.93-0.975c2.168-1.62,2.613-4.69,0.99 +2-6.858C309.464,617.927,307.99,617.247,306.497,617.247 L306.497,617.247z"/> </g> <g> <path style="fill:#D7DF23;" d="M292.911,568.609c-1.244-0.001-2 +.384-0.571-3.128-1.567c-0.624-0.835-0.885-1.862-0.736-2.894 c0.149-1.03,0.691-1.941,1.526-2.564c0.68-0.509,1.486-0.777 +,2.331-0.777c1.244,0,2.384,0.571,3.128,1.567 c0.624,0.835,0.885,1.862,0.735,2.894c-0.149,1.03-0.691,1.9 +41-1.525,2.565C294.562,568.341,293.756,568.609,292.911,568.609 C292.911,568.609,292.911,568.609,292.911,568.609z"/> <path style="fill:#FFFFFF;" d="M292.904,561.807c0.926,0,1.774, +0.425,2.327,1.166c0.464,0.62,0.658,1.385,0.547,2.151 c-0.111,0.767-0.514,1.444-1.135,1.907c-0.506,0.378-1.105,0 +.578-1.733,0.578c-0.926,0-1.774-0.425-2.327-1.166 c-0.464-0.621-0.658-1.385-0.547-2.151c0.111-0.767,0.514-1. +443,1.136-1.907C291.678,562.007,292.276,561.807,292.904,561.807 M292.904,559.807c-1.021,0-2.049,0.317-2.929,0.976c-2.169, +1.619-2.614,4.689-0.994,6.858c0.962,1.288,2.437,1.969,3.929,1.969 c1.021,0,2.049-0.317,2.93-0.976c2.168-1.619,2.613-4.689,0. +993-6.858C295.871,560.487,294.396,559.807,292.904,559.807 L292.904,559.807z"/> </g> <g> <path style="fill:#27AAE1;" d="M305.435,547.02c-1.245,0-2.385- +0.57-3.129-1.566c-1.287-1.723-0.933-4.172,0.791-5.46 c0.679-0.507,1.485-0.775,2.331-0.775c1.245,0,2.385,0.57,3. +129,1.566c1.287,1.723,0.932,4.172-0.791,5.46 C307.085,546.751,306.279,547.02,305.435,547.02L305.435,547 +.02z"/> <path style="fill:#FFFFFF;" d="M305.427,540.218c0.926,0,1.774, +0.425,2.327,1.165c0.957,1.281,0.693,3.103-0.588,4.06 c-0.505,0.378-1.104,0.577-1.731,0.577c-0.926,0-1.775-0.425 +-2.328-1.165c-0.958-1.281-0.694-3.103,0.587-4.06 C304.2,540.417,304.799,540.218,305.427,540.218 M305.427,53 +8.218c-1.02,0-2.049,0.317-2.929,0.975 c-2.168,1.62-2.613,4.69-0.993,6.859c0.962,1.288,2.437,1.96 +8,3.93,1.968c1.02,0,2.049-0.317,2.929-0.975 c2.168-1.62,2.613-4.69,0.993-6.859C308.395,538.897,306.92, +538.218,305.427,538.218L305.427,538.218z"/> </g> <g> <path style="fill:#D7DF23;" d="M315.226,551.938c-1.245,0-2.385 +-0.571-3.129-1.566c-0.623-0.835-0.885-1.862-0.735-2.894 c0.149-1.03,0.691-1.941,1.526-2.564c0.68-0.508,1.485-0.776 +,2.331-0.776c1.244,0,2.385,0.57,3.129,1.565 c1.286,1.724,0.931,4.173-0.792,5.46C316.876,551.67,316.07, +551.938,315.226,551.938L315.226,551.938z"/> <path style="fill:#FFFFFF;" d="M315.219,545.138c0.926,0,1.774, +0.425,2.327,1.163c0.956,1.282,0.692,3.104-0.589,4.061 c-0.505,0.378-1.104,0.577-1.732,0.577c-0.926,0-1.773-0.425 +-2.326-1.165c-0.464-0.621-0.658-1.385-0.548-2.151 c0.111-0.767,0.515-1.443,1.136-1.907C313.991,545.337,314.5 +91,545.138,315.219,545.138 M315.219,543.138 c-1.021,0-2.05,0.317-2.93,0.975c-2.169,1.619-2.613,4.689-0 +.993,6.858c0.962,1.288,2.437,1.968,3.929,1.968 c1.021,0,2.05-0.317,2.93-0.975c2.168-1.619,2.613-4.689,0.9 +94-6.859C318.186,543.816,316.711,543.138,315.219,543.138 L315.219,543.138z"/> </g> </g> </svg>

If this isn't quite it, let me know, I have some time this afternoon for a quick edit or two. Hope this helps.


"...the adversities born of well-placed thoughts should be considered mercies rather than misfortunes." Don Quixote


Comment on Re: [OT] Displaying 4D data ... (Quick SVG Sketch)
Download Code
Re^2: [OT] Displaying 4D data ... (Quick SVG Sketch)
by BrowserUk (Pope) on Dec 10, 2011 at 03:13 UTC

    Luis, many thankyous for your time. That is certainly a pretty picture :)

    I'm not yet sure that I understand what it displays, but I am very interested in how you produced it? What is Illustrator?

    It took me a while to work out that I could view it directly in my browser. (Aside: Would be nice if we could embed such things in our PM posts -- though I can feel the resistance to that suggestion building even before I hit 'create' :)

    What might make my understanding of the representation easier is if you could also post the basic data points that the image represents?

      Sorry about not clarifying how to view the image. I used Adobe Illustrator CS5 but you could get away with Inkscape or maybe even using Cairo then exporting an SVG file.

      I just read your longer reply and would like to take a day to think about it if that's alright. Let's ignore the sketch I made for now. :-)

      "...the adversities born of well-placed thoughts should be considered mercies rather than misfortunes." Don Quixote

      I suppose better late than never. You've probably solved this and moved on but I increasingly feel a good candidate to represent a large volume of data like this would be a heatmap. I'm pretty certain that through color value and saturation you could abstractly accommodate data volume and frequency.

      In addition to the heatmap examples (starting with the fifth one down) on the following page there are number of well executed 2 dimensional graphs.
      http://cs.jhu.edu/~razvanm/fs-expedition/tux3.html


      "...the adversities born of well-placed thoughts should be considered mercies rather than misfortunes." Don Quixote
        You've probably solved this and moved on

        Actually no. This is a back-burner project I've been re-visiting in quiet moments on and for several years. I've arrived at several partial solutions (to the underlying problem rather than the graphing), but I'm generally looking for faster, better, more complete solutions and the graphing is means to one possibility.

        I increasingly feel a good candidate to represent a large volume of data like this would be a heatmap.

        Heatmaps work well for 3D data on a 2D graph per the examples you linked. They can also work pretty well for 4D data on a 3D graph where the 4th dimension is a continuous function -- like this for example.

        But for my datasets, the 4th dimension is discrete and can cover a huge range -- potentially more than there are colors in 24-bits. But even when the range is more reasonable, picking out small variations in the colors of individual pixels is beyond the scope of human eyes. Mine at least.

        The best solution I've thought of to date, would be to plot the 4th dimension as a vertical line on top of the 3rd dimension point. Piss poor description :(

        If you imagine the following to be a 2D slice through a 3D plot which is oriented squarely with X running horizontally, Y running 'into' the screen, and Z vertically. Then the vertical lines represent the (log10 of the) 4th dimension with the base of the line being the Z point:

        Z-max -| -| | -| | | | -| | | | -| | | ||| -| | | ||| ||| -| | || | || | |||| -| | || || | | || | -| | | | ||| || || | -| | | | | || | -| | | || | -| | | | || -| | | | || -| | | -| Z-min -+------------------------------------------------+ X-min X-max

        The vertical lines would be continuous. Their low extremity would be the Z-value. Their length the log10 of the frequency.

        Now put many of those slices together in the Y dimension with perspective etc. in a 3D plot and you get a visual representation that shows how the data clusters, but also the peaks and outliers within each cluster.

        My only problem now is that I cannot work out how to persuade gnuplot to draw it for me :(


        With the rise and rise of 'Social' network sites: 'Computers are making people easier to use everyday'
        Examine what is said, not who speaks -- Silence betokens consent -- Love the truth but pardon error.
        "Science is about questioning the status quo. Questioning authority".
        In the absence of evidence, opinion is indistinguishable from prejudice.

        The start of some sanity?

Log In?
Username:
Password:

What's my password?
Create A New User
Node Status?
node history
Node Type: note [id://942688]
help
Chatterbox?
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others pondering the Monastery: (5)
As of 2014-12-27 11:54 GMT
Sections?
Information?
Find Nodes?
Leftovers?
    Voting Booth?

    Is guessing a good strategy for surviving in the IT business?





    Results (177 votes), past polls