Wrong Text Placement in GetOrgChart - getorgchart
I've got Wrong Text Placement during rendering of each node in GetOrgChart.Please see the Screenshot
Please Help me to fix it.
I don't know why But I realized that the only way to adjust X or Y Positioning of text node in GetOrgChart is modifying the textPoints OR textPointsNoImages based on whether we have image node or not in related theme Array.
Related
Right/center align text using opentype.js
I am using OpenType.js to generate SVG from strings, by default the alignment is set to left, which works most of the time, but occasionally I have some texts that need to be center/right aligned. I checked the web and there is very little on this subject, so I was wondering if anyone has ever looked into this in the past and can give me a hint on how I can get center/right alignment. EDIT I ended up using fabric js to achieve the above.
Graphviz labels appearing if you hover over them?
I am currently using graphviz through Python 3.x to visualize a digraph with info on the nodes and edges as graphviz-labels. This gets crowded, quite fast. Therefore, I was wondering whether there is a possibility to have the label info appear when you hover your cursor over the corresponding node or edge? With kind regards, Tobi Edit: I have given up on that issue for now. I looked into the python-graphviz-package, but to me it seemed as if the tooltip-parameter does not get passed on properly.
You did not mention your desired output format. If you are producing SVG output, read the attribute documentation about tooltip. somenode [label="small" tooltip="thanks for asking, over the last few years..."]
Advanced CSS Circles
I'm trying to make 3 different circles to my website. I don't want to insert it as a graphic/image file. So I've been trying to achieve it using CSS3, but I can't really work my fingers around it. What will it look like? I have uploaded a picture of what I'm trying to achieve at: www.sp34k.com/etc/circles.jpg I can't really show the code I've been trying to use to achieve this, as it all looks totally weird and nothing floats currectly. What I've tried What I've tried is to make 3 circles with position absolute and then use % (percentage) to determine the width of the colored parts, but I can't twist my mind around how it should be set up. Any suggestions is appreciated, Mike
Here is a simple try of me to achieve the effect you want: DEMO edit: css-only solution It can be easily animated with javascript or keyframes. Arbitrary content would go into the inner div. To change the percentage, simply adjust the angle of the pseudo-elements. With a little more effort this could be easily refined I guess;) Note: the transform has the webkit-prefix, so it works only in chrome/safari - to see it in firefox or other browsers, you need to change the prefix. P.S. I will animate it when I'm home from work.
Good one by Christoph but he is using SASS/SCSS which are comparatively slow then normal CSS because they have to be converted to CSS before browser render it so I have have a different Solution for you try this fiddle
Google Charts API Z-index
Given: http://chart.apis.google.com/chart?chxr=0,0,21|1,0,320&chxt=x,y&chs=600x500&cht=s&chco=c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0&chd=t:5,5,5,5,10,5,5,5,5,10,19,29,14,14,24,62,24,5,19,10,10,24,10,14,10,29,14,24,100,14,10,10,19,24,52,14,24,43,29,14,24,24,10,19,29,24,19,29,10,38,5,5,5,24,10,10,24,52,14,14,14,10,10,5,19,10,5,14,14,10,14,19,14,19,10,5,5,10,10,10,10,24,10,5,5,5,5,10,14,24,5,5,10,5,14,14,5,5,14,5,29,10,14,5,14,10,62,10,10,19,5,5|3,2,4,4,4,10,4,10,5,100,24,56,52,69,52,75,42,29,41,35,25,35,53,45,52,75,51,75,100,53,29,75,32,83,100,62,83,100,38,29,56,62,42,62,29,39,53,32,32,48,43,20,28,37,41,27,34,43,41,17,37,17,42,22,59,24,23,47,23,43,19,50,50,47,44,43,42,42,40,40,38,37,35,35,35,35,34,34,34,33,29,26,23,22,24,35,16,20,29,25,25,21,11,16,21,23,16,20,15,22,16,23 Which produces: I'm having trouble forcing the black dots to the top, does anyone know how I can achieve this?
Move black dots to the end: http://chart.apis.google.com/chart?chxr=0,0,21|1,0,320&chxt=x,y&chs=600x500&cht=s&chco=c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|c0c0c0|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000|000000&chd=t:5,5,5,5,10,5,5,5,5,10,19,29,14,14,24,62,24,5,19,10,10,24,10,14,10,29,14,24,100,14,10,10,19,24,52,14,24,43,29,14,24,24,10,19,29,24,19,10,5,19,10,5,14,14,10,14,19,14,19,10,5,5,10,10,10,10,24,10,5,5,5,5,10,14,24,5,5,10,5,14,14,5,5,14,5,29,10,14,5,14,10,62,10,10,19,5,5,29,10,38,5,5,5,24,10,10,24,52,14,14,14,10|3,2,4,4,4,10,4,10,5,100,24,56,52,69,52,75,42,29,41,35,25,35,53,45,52,75,51,75,100,53,29,75,32,83,100,62,83,100,38,29,56,62,42,62,29,39,53,42,22,59,24,23,47,23,43,19,50,50,47,44,43,42,42,40,40,38,37,35,35,35,35,34,34,34,33,29,26,23,22,24,35,16,20,29,25,25,21,11,16,21,23,16,20,15,22,16,23,32,32,48,43,20,28,37,41,27,34,43,41,17,37,17 EDIT: BTW: There is no z-index for chd based on goolge's documentation
Have you tried debugging using the Chart Wizard? It seems your black data points are located in the middle of your supplied data. Move them to the start/finish and see if that helps.
underlining text in sifr
I've recently been getting into using sifr as a healthy alternative to generating text as image using php. I've got a question about underlining text, for a website design I need to be able to specify the thickness of the underline and the distance from the text, is there any way to accomplish this with sifr? If not, is there a way to be able to solve this with css? I've been trying to get my head around it, but since I haven't found a way to get the exact width of the sifr text, I'm doubting whether it's possible at all. Any thoughts on this? They're much appreciated. Kind regards, Thijs.
I suspect that Flash renders a fake underline, and no, you can't change how it looks. The only option would be to render a border underneath the Flash movie using HTML & CSS, but I don't that'll work very well. With sIFR 3, if you specify the fitExactly: true option in the replacement, the Flash movie will be the same width as the internal text.