FPDF - SetFillColor inside cell - javascript

I have the need to create the cell with background color, but I was using the example:
$pdf->SetFillColor(135,206,235);
$pdf->Rect(9, 52, 190, 7, 'F');
the problem with this example is that if I get a larger than expected number of lines, it does not usually fit as it is, so how can I define the color of the cell I'm using without putting XY in its location? it's possible?
Original Code:
$pdf->SetFont('Arial','B',12);
$pdf->Cell(96 ,10,'RLT Resume',0,0);

using this code i was able to fix my problem, the terms was bad on start:
$pdf->SetFont('PetitaBold','',12);
$pdf->SetFillColor(70,130,180);
$pdf->SetDrawColor(25,25,12);
$pdf->SetTextColor(255,255,255);

Related

Resize span included in text paragraph horizontally based on text characters

I need to highlight some words in a paragraph of text using spans. The resulting highlighted words come from an algorithm which returns a set of "annotations" representing the words to highlight. For instance, the algorithm might give back the following:
annotations = [{start: 5, end: 10}, {start: 12, end: 17}, ...]
For each annotation I insert in the paragraph a component Tag which wraps the corresponding word based on the offset. For example:
Hello this is an <Tag>example</Tag> :)
The problem is that the algorithm can make mistakes by generating annotations which aren't completely right, for example an offset might be too long or too short.
This is the reason I want the user to be able to change the offset for an annotation.
I was thinking to let the user drag an end of a Tag (to the left, or to the right) to basically change the offset with a very common and suitable interaction. The problem I have is restricting the drag based on the characters of the paragraph of text.
This is what I would hope to obtain:
I am a bit lost on how I could achieve this. Any help would be appreaciated!

Label arrows created in ArrowHelper of THREE.js

In this question (Labelling the vertices in AxisHelper of THREE.js) is explained how to label axis created with THREE.AxisHelper. I tried to follow the same procedure for THREE.ArrowHelper without sucessfull. So, I'd like to know how to label the arrows I created, just like when indicating the labels of a coordinate system (x,y,z). In this link it how I tried to reproduce the idea: http://jsfiddle.net/g7oqexr8/
What exactly does not work? It does not show up? It crashes? (if so, where???)
Tip:
Why don't you add the label object to the created arrow?
instead of:
//text.position.x = arrowHelper.geometry.vertices[1].x;
//text.position.y = arrowHelper.geometry.vertices[1].y;
//text.position.z = arrowHelper.geometry.vertices[1].z;
//text.rotation = camera.rotation;
//scene.add(text);
arrowHelper.add(text);
This adds to 'text' the position, rotation and scaling from the arrowHelper.
If you want, you can modify afterwards the 'text' rotation, position or scaling.
EDIT:
Documentation stands:
TextGeometry uses typeface.json generated fonts. Some existing fonts can be found located in /examples/fonts and must be included in the page.
That's probably why line with:
var textGeo = new THREE.TextGeometry('Y', {size: 5, height: 2, curveSegments: 6,font: "helvetiker",style: "normal"});
is crashing.

How to show overlapping in various columns of highcharts column range graph

I have a requirement to display an event based calendar. However, there are almost no functionalities related to calendar and its just a graphical representation of events throughout a year. Hence I have planned to use HighCharts columnrange graph. This saves me a lot of boilerplate for event listening.
However, when I get several overlapping events, its hard for me to show them as distinct.
How can I use highcharts existing features to accomplish this.
I have looked for style properties in events. But couldn't found anything helpful.
I tried searching if highcharts provides any form of gradient's implementation, but I didn't get much help there either.
I tried giving color with an opacity as rgb(r,g,b, 0.2) but somehow this gets turn to black.
Here is my working demo. In this chart event8 and event7 are overlapping. There exact time duration is similar to event 9 and event 10 respectively.
I found a similar question here, but this question talks of vertical overlapping while I need to distinguish horizontal overlapping (as shown in demo). Also I tried the answer given here, which had no affect.
Can someone suggest the way to achieve it ?
I think that good idea is to use partially-transparent colors for your columns. To use transparent colors you should use rgba, not rgb parameter.
Here you can find code that may help you:
data: [{
name: 'event7',
x: 1,
low: 36,
high: 43,
color: "red"
}, {
name: 'event8',
x: 1,
low: 25,
high: 38,
color: "rgba(100,100,100,0.6)"
}]
And here you can find live example how it can work:
http://jsfiddle.net/ay1Lk2yw/4/

Html Color Code Pickup in javascript

Actually i want that, suppose i have a colorcode #FF3366. How can i examine that it is lighter or darker?
Actually i want to create a textfield and when the font color of the textfield is changed to lighter color by a javascript then the background color of the textfield becomes darker autometically for showing the value of the text field clearly and vise versa.
Please help me.
This formula is from years ago, in the W3's site, but I can't locate the address.
It sorts rgb colors from darkest to lightest. Works fine with just 2...
function lumenSort(ac, bc){
return ((ac[0]*299 + ac[1]*587 + ac[2]*114)/1000-
(bc[0]*299 + bc[1]*587 + bc[2]*114)/1000);
}
var A= [[0, 0, 0], [255, 255, 255]].sort(lumenSort);
alert(A[0]+' is darker than '+A[1]);
I suspect that you can use the API exposed by COLOURlovers to do what you need. Personally I haven't used the service before nor am I affiliated with it any way but rather was the first result from Google.

Rotate/transform print with Raphael and cufon weird results

Cant find a fix for this anywhere! I want to produce a single character and then rotate it (inside a mouseover event). Since I need to use cufon for the custom font, print
must be used to summon the text. This works fine. But when in any way
trying to transform the single character weird things happen. It seems
to reset itself in size and placement, making it impossible to use.
Just applying a rotation with transform : "r0" makes the character huge and displaced in the middle of the screen.
Any thoughts on how to animate a printed "set" such as this??
var paper = new Raphael(document.getElementById('elementDiv'), 1350,
900);
var custom = paper.print(5, 25, "A", paper.getFont("Web"),
30).attr({fill: "#000"});
custom[0].stop().animate({fill: "#4d3416", transform: "r20, s2"}, 300,
"<>");
Thanks a bunch!
This problem has been solved by newer Raphael libraries, animations on objects created by print is now behaving correctly

Categories

Resources