tcpdf color for every page - html

I want to set the color of the right margin in tcpdf . This is the code:
$bMargin = $pdf->getBreakMargin();
// get current auto-page-break mode
$auto_page_break = $pdf->getAutoPageBreak();
// disable auto-page-break
$pdf->SetAutoPageBreak(false, 0);
$pdf->Rect(0, 0, 10, 1000,'F',array(),array(199, 245, 206));
$pdf->SetAutoPageBreak($auto_page_break, $bMargin);
// set the starting point for the page content
$pdf->setPageMark();
The problem is that the colored right margin only shows up on the first page. I want it to show up on all the pages. How can I fix it?

class MYPDF extends TCPDF {
//Page header
public function Header() {
// Logo
$image_file = K_PATH_IMAGES.'logo_example.jpg';
//$this->Image($image_file, 10, 5, 15, '', 'JPG', '', 'T', false, 300, '', false, false, 0, false, false, false);
// Set font
$this->SetFont('helvetica', 'B', 20);
$this->Rect(0, 0, 1000, 10,'F',array(),array(199, 245, 206));
$this->SetTextColor(0, 0, 50);
// Title
$this->Cell(0, 15, 'mysite', 0, false, 'C', 0, '', 0, false, 'M', 'M');
$bMargin = $this->getBreakMargin();
// get current auto-page-break mode
$auto_page_break = $this->getAutoPageBreak();
// disable auto-page-break
$this->SetAutoPageBreak(false, 0);
$this->Rect(0, 0, 13, 1000,'F',array(),array(199, 205, 206));
$this->SetAutoPageBreak($auto_page_break, $bMargin);
// set the starting point for the page content
$this->setPageMark();
}
// Page footer
public function Footer() {
// Position at 15 mm from bottom
$this->SetY(-15);
// Set font
$this->SetFont('helvetica', 'I', 8);
$this->SetTextColor(150, 50, 50);
// Page number
$this->Cell(0, 10, 'Page '.$this->getAliasNumPage().'/'.$this->getAliasNbPages(), 0, false, 'C', 0, '', 0, false, 'T', 'M');
}
}

Related

HTML/PHP to PDF? how....?

I have some page with tables and 1 img that I want to create a button to make it a pdf.
The problem is, it's hebrew (utf-8 encoded).
Is there any way to do it?
I tried to use jsPDF but it's dosen't support hebrew.
Basicly what I want to make is a button that will create a pdf file that I will send via email as attachment.
Any suggestions?
Thank you!
This is what I've tried:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>
<script>
function demoFromHTML() {
var pdf = new jsPDF('p', 'pt', 'letter');
source = $('#content')[0];
specialElementHandlers = {
// element with id of "bypass" - jQuery style selector
'#bypassme': function (element, renderer) {
// true = "handled elsewhere, bypass text extraction"
return true
}
};
margins = {
top: 80,
bottom: 60,
left: 40,
width: 522
};
pdf.fromHTML(
source, // HTML string or DOM elem ref.
margins.left, // x coord
margins.top, { // y coord
'width': margins.width, // max width of content on PDF
'elementHandlers': specialElementHandlers
},
function (dispose) {
pdf.save('Test.pdf');
}, margins
);
}
</script>
Run Code
<div id="content">
HTML HERE
</div>
I recommend you to use this fpdf tool it is very simple to use.
Here there is a demo of my code
if(isset($_POST['pdf'])){
require('fpdf/fpdf.php');
$sname = $_POST['sname'];
$emailid = $_POST['emailid'];
$joindate = $_POST['joindate'];
$contact = $_POST['contact'];
$birthdate = $_POST['birthdate'];
$about = $_POST['about'];
$today = date("Y");
$pdf = new FPDF();
$pdf -> AddPage();
$pdf->Image('logo.png',85,6,40);
// Line break
$pdf->Ln(20);
// Arial bold 15
$pdf->SetFont('Arial','',15);
// Move to the right
$pdf->Cell(80);
// Title
$pdf->Cell(30,10,'Module '.$today,0,0,'C');
$pdf->Ln(10);
// Line break
$pdf->Ln(20);
$pdf->SetTextColor(0,0,0,1);
$w = $pdf->GetStringWidth($contact)+60;
$pdf->SetX((170-$w)/2);
$pdf->Cell(40, 10, 'Name:', 0, 0, 'L');
$pdf->Cell($w, 10, $sname, 0, 1, 'R');
$pdf->Ln(10);
$pdf->SetX((170-$w)/2);
$pdf->Cell(40, 10, 'Birth Date:', 0, 0, 'L');
$pdf->Cell($w, 10, $birthdate, 0, 1, 'R');
$pdf->Ln(10);
$pdf->SetX((170-$w)/2);
$pdf->Cell(40, 10, 'Telephone:', 0, 0, 'L');
$pdf->Cell($w, 10, $contact, 0, 1, 'R');
$pdf->Ln(10);
$pdf->SetX((170-$w)/2);
$pdf->Cell(40, 10, 'Email:', 0, 0, 'L');
$pdf->Cell($w, 10, $emailid, 0, 1, 'R');
$pdf->Ln(10);
$pdf->SetX((170-$w)/2);
$pdf->Cell(40, 10, 'Date of Join:', 0, 0, 'L');
$pdf->Cell($w, 10, $joindate, 0, 0, 'R');
$pdf->Ln(30);
$pdf->SetX((170-$w)/2);
$pdf->Cell(40, 10, '', 0, 0, 'R');
$pdf->Cell($w, 10, 'Signature:______________', 0, 0, 'R');
$pdf->Output('I',"Module {$today} of {$sname}.pdf");
}

Coloring scatter plot points differently based on certain conditions

I have a scatter plot made using plotly.py and I would like to color certain points in the scatter plot with a different color based on a certain condition. I have attached a sample code below :
import plotly.plotly as py
import plotly.graph_objs as go
from plotly.offline import plot
data = [4.1, 2.1, 3.1, 4.4, 3.2, 4.1, 2.2]
trace_1 = go.Scatter(
x = [1, 2, 3, 4, 5, 6, 7],
y = data
)
layout = go.Layout(
paper_bgcolor='rgb(255,255,255)',
plot_bgcolor='rgb(229,229,229)',
title = "Sample Plot",
showlegend = False,
xaxis = dict(
mirror = True,
showline = True,
showticklabels = True,
ticks = 'outside',
gridcolor = 'rgb(255,255,255)',
),
yaxis = dict(
mirror = True,
showline = True,
showticklabels = False,
gridcolor = 'rgb(255,255,255)',
),
shapes = [{
'type': 'line',
'x0': 1,
'y0': 4,
'x1': len(data),
'y1': 4,
'name': 'First',
'line': {
'color': 'rgb(147, 19, 19)',
'width': 1,
'dash': 'longdash'
}
},
{
'type': 'line',
'x0': 1,
'y0': 3,
'x1': len(data),
'y1': 3,
'line': {
'color': 'rgb(147, 19, 19)',
'width': 1,
'dash': 'longdash'
}
}
]
)
fig = dict(data = [trace_1], layout = layout)
plot(fig, filename = "test_plot.html")
Here's the output Output Scatter plot
Here the long dashed horizontal lines have corresponding x values 4 & 3 respectively. As one can see, points 1, 2, 4, 6 and 7 lie outside the dashed lines. Is there a way to color them differently based on the condition (x > 3) and (x<4).
Here's a reference to something I found while searching for a solution :
Python Matplotlib scatter plot: Specify color points depending on conditions
How can I achieve this in plotly.py ?
You can accomplish this by using a numeric array to specify the marker color. See https://plot.ly/python/line-and-scatter/#scatter-with-a-color-dimension.
Adapting your particular example to display red markers below 3, green markers above 4, and gray markers between 3 and 4:
import plotly.graph_objs as go
from plotly.offline import init_notebook_mode, iplot
init_notebook_mode()
data = [4.1, 2.1, 3.1, 4.4, 3.2, 4.1, 2.2]
color = [
-1 if v < 3 else 1 if v > 4 else 0
for v in data
]
colorscale = [[0, 'red'], [0.5, 'gray'], [1.0, 'green']]
trace_1 = go.Scatter(
x = [1, 2, 3, 4, 5, 6, 7],
y = data,
marker = {'color': color,
'colorscale': colorscale,
'size': 10
}
)
layout = go.Layout(
paper_bgcolor='rgb(255,255,255)',
plot_bgcolor='rgb(229,229,229)',
title = "Sample Plot",
showlegend = False,
xaxis = dict(
mirror = True,
showline = True,
showticklabels = True,
ticks = 'outside',
gridcolor = 'rgb(255,255,255)',
),
yaxis = dict(
mirror = True,
showline = True,
showticklabels = False,
gridcolor = 'rgb(255,255,255)',
),
shapes = [{
'type': 'line',
'x0': 1,
'y0': 4,
'x1': len(data),
'y1': 4,
'name': 'First',
'line': {
'color': 'rgb(147, 19, 19)',
'width': 1,
'dash': 'longdash'
}
},
{
'type': 'line',
'x0': 1,
'y0': 3,
'x1': len(data),
'y1': 3,
'line': {
'color': 'rgb(147, 19, 19)',
'width': 1,
'dash': 'longdash'
}
}
]
)
fig = dict(data = [trace_1], layout = layout)
iplot(fig)
Hope that helps!

Add a group to a follower - Phaser 3

I'm noob at Phaser 3 and trying to add a group (2 sprites) in a follower. The code works when I use a sprite at 'add.follower'.
function create () {
var bola = this.add.group();
bola.create(0, 0, 'bola15');
bola.create(0, 0, 'bolasombra');
var line1 = new Phaser.Curves.Line([ 100, 100, 500, 100 ]);
var line2 = new Phaser.Curves.Line([ 500, 100, 500, 500 ]);
path1 = this.add.path();
path1.add(line1);
path1.add(line2);
var mover = this.add.follower(path1, 0, 0, bola);
mover.startFollow({
positionOnPath: true,
duration: 3000,
yoyo: false,
repeat: 0,
rotateToPath: false,
verticalAdjust: true
});
}
That's what I got:
Any solution for that, or other way to make something like that?
Edit:
Have tried with 'container' and got the same result:
bola = this.add.container(0,0);
bola1 = this.add.sprite(0,0,'bola15');
bola2 = this.add.sprite(0,0,'bolasombra');
bola.add(bola1);
bola.add(bola2);
At current state, PathFollower is set up to take in only a single GameObject. Unfortunately, this means you'll have to add your group items to a follower one by one. You can set up a loop to run through your group items and create the path followers like this:
for (var i = 0; i < bola.children.entries.length; i++) {
var mover = this.add.follower(path1, 0, 0, bola.children.entries[i].texture.key);
mover.startFollow({
positionOnPath: true,
duration: 3000,
yoyo: false,
repeat: 0,
rotateToPath: false,
verticalAdjust: true
});
}
Check this example from the Phaser 3 labs to see another example of how you can use multiple items with the same path if the group structure isn't important to your game.

Google Visualization Column Chart specify Target line as Certainty role

When i put this below code i came with on visualization playground i get the Goal/Target line, but i want it to be dashed/dotted which requires certainty role as specified in the docs. Can anyone enlighten me how to do it with a array input to Google Datatable, or Datatable json string format
Code
function drawVisualization() {
// Create and populate the data table.
var data = google.visualization.arrayToDataTable([
['Year', 'Red', 'Yellow', 'Green','Target'],
['2003', 20, 0, 0,80],
['2004', 0, 55, 0,80],
['2005', 0, 0, 80,80],
['2005', 0, 0, 85,80]
]);
// Create and draw the visualization.
new google.visualization.ColumnChart(document.getElementById('visualization')).
draw(data,
{title:"Yearly Coffee Consumption by Country",
width:600, height:400,
hAxis: {title: "Year"},
legend:'none',
colors:['red','yellow','green'],
//isStacked: true,
series:{
3:{type:'steppedArea',areaOpacity:0}
}
//interpolateNulls: true
}
);
}​
Update
I got it to this level below, with the code but how do i make the line stretch graph width
function drawVisualization() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Month'); // Implicit domain label col.
data.addColumn('number', 'Sales'); // Implicit series 1 data col.
data.addColumn({type:'number'}); // interval role col.
data.addColumn({type:'number'}); // interval role col.
data.addColumn({type:'number'}); // interval role col.
data.addColumn({type:'boolean',role:'certainty'}); // certainty col.
data.addRows([
['Red',20, 0,0, 80,true],
['Yellow', 0, 55, 0, 80,false],
['Green', 0, 0, 85, 80,false]
]);
// Create and draw the visualization.
new google.visualization.ColumnChart(document.getElementById('visualization')).
draw(data,
{title:"Yearly Coffee Consumption by Country",
width:600, height:400,
hAxis: {title: "Year"},
legend:'none',
colors:['red','yellow','green'],
//isStacked: true,
series:{
3:{type:'line',areaOpacity:0}
}
//interpolateNulls: true
}
);
}​
PlayGround:
https://code.google.com/apis/ajax/playground/?type=visualization#column_chart
Roles Docs:
https://developers.google.com/chart/interactive/docs/roles
So what is the right JSON format for dashed lines?
Is there any, i mean anyway i can display a arrow indicator at the right corner of the Target line to visually indicate the Goal?
You can achieve this by creating empty columns at the beginning and end of your chart, and then setting the view window to be within the range that you actually want. The code below achieves this:
function drawVisualization() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Month'); // Implicit domain label col.
data.addColumn('number', 'Sales'); // Implicit series 1 data col.
data.addColumn({type:'number'}); // interval role col.
data.addColumn({type:'number'}); // interval role col.
data.addColumn({type:'number'}); // interval role col.
data.addColumn({type:'boolean',role:'certainty'}); // certainty col.
data.addRows([
['', null, null, null, 80, false],
['Red',20, 0,0, 80,true],
['Yellow', 0, 55, 0, 80,false],
['Green', 0, 0, 85, 80,false],
['', null, null, null, 80, true]
]);
// Create and draw the visualization.
new google.visualization.ColumnChart(document.getElementById('visualization')).
draw(data,
{title:"Yearly Coffee Consumption by Country",
width:600, height:400,
hAxis: {title: "Year"},
legend:'none',
colors:['red','yellow','green'],
//isStacked: true,
series:{
3:{type:'line',areaOpacity:0}
},
hAxis: {
viewWindow: {
min: 1,
max: 4
}
}
//interpolateNulls: true
}
);
}
​

Kineticjs load json canvas

I always got the error:
"TypeError: Kinetic[type] is not a constructor"
"ReferenceError: reference to undefined property obj.nodeType"
when i try to load one json.
json = stage.toJSON();
stage = Kinetic.Node.create(json, 'myCanvas');
the method _createNode from Kineticjs 4.3.3
var no = new Kinetic[type](obj.attrs);
on my canvas I have a simple group
var circle1 = new Kinetic.Circle({
x: 40,
y: 50,
radius: 42,
fill: 'white',
stroke: 'black',
strokeWidth: 1,
draggable: false
});
var polygon1Tab1 = new Kinetic.RegularPolygon({
x: 40,
y: 50,
radius: 27,
sides: 4,
stroke: 'black',
strokeWidth: 4,
draggable: false
});
polygon1Tab1.rotateDeg(45);
var group1 = new Kinetic.Group({
draggable: true,
});
group1.add(circle1.clone());
group1.add(polygon1.clone());
What is "polygon1" here?
group1.add(polygon1.clone());
I created this example. Everything forks fine: http://jsfiddle.net/lavrton/N3UPX/
'polygon1' It's just one name ... a change!!!!
I take your code and place to run and continue with the same error!
when i print the json I noticed that it has an error!
he puts this "children": "[]" and should not have quotes in brackets
if I copy and put my string this fixed string corrected wheel normal!!
I made a method to remove the error .... Now I'm with an error
SyntaxError: JSON.parse: expected property name or '}'
var json = polygonLayer.toJSON();
json = json.replace('"children":"', '"children":');
json = json.substring(0, json.length-2) + json.substring(json.length-1, json.length);
whereas using the same fixed string works!
I'm using version 4.3.3
this work
var json = '{"attrs":{"clearBeforeDraw":true,"visible":true,"listening":true,"opacity":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"offset":{"x":0,"y":0},"draggable":false,"dragOnTop":true},"nodeType":"Layer","children":[{\"attrs\": {\"width\": 600, \"height\": 400, \"cornerRadius\": 0, \"fillEnabled\": true, \"strokeEnabled\": true, \"shadowEnabled\": true, \"dashArrayEnabled\": true, \"fillPriority\": \"color\", \"visible\": true, \"listening\": true, \"opacity\": 1, \"x\": 0, \"y\": 0, \"scale\": {\"x\": 1, \"y\": 1}, \"rotation\": 0, \"offset\": {\"x\": 0, \"y\": 0}, \"draggable\": false, \"dragOnTop\": true, \"fill\": \"white\"}, \"nodeType\": \"Shape\", \"shapeType\": \"Rect\"}]}';
layer = Kinetic.Node.create(json, 'canvas');
but this dont work
var json = layer.toJSON();
layer = Kinetic.Node.create(json, 'canvas');