2015-05-24 50 views
-1

我對webdev的世界相當陌生,遇到過一個小問題。我想實現一個「縮放」功能,在畫布圖,需要添加Java函數,但我不知道這是要走的路:如何在PHP函數中打印/編碼多行html5/javascript?

print "document.getElementById(\"plus\").addEventListener("click", function(){"; 
print " scale /= scaleMultiplier;"; 
print " draw(scale, translatePos);"; 
print "}, false);"; 

這是添加多行的正確方法的Javascript/html5代碼內的PHP函數?

以防萬一的需要,我的功能:

function draw($num_of_exons, $start_positions, $end_positions, $start_first_exon, $end_last_exon, $target_pos, $coding_region_start, $coding_region_end, $canvas_x){ 

//Variable initilisations 
//variable initialization removed 

//Sort out target positions 
//variable initialization removed 

//Main Diagram 

print "<canvas id=\"$canvas_x\" width=$CANVAS_WIDTH height=$CANVAS_HEIGHT  style=\"border:1px solid #c3c3c3;\">"; 
print "Your browser does not support the HTML5 canvas tag."; 
print "</canvas>"; 

print "<script>"; 
print "var c = document.getElementById(\"$canvas_x\");"; 
print "var ctx = c.getContext(\"2d\");"; 
print "ctx.fillStyle = \"#273c61\";"; // colour 

//CODING REGION 

print "ctx.fillStyle = \"#80d04b\";"; //rect colour 
print "ctx.fillRect($coding_start,$CODING_REGION_POSITION_CANVAS,($coding_end - $coding_start), $CODING_REGION_HEIGHT);"; //draw rectangle 

for($x = 0; $x < $num_of_exons; $x++) { 

    $start_pos = $start_positions[$x]; 
    $start_pos = scale($start_pos, $start_first_exon, $end_last_exon, $new_range_min, $new_range_max); 

    $end_pos = $end_positions[$x]; 
    $end_pos = scale($end_pos, $start_first_exon, $end_last_exon, $new_range_min, $new_range_max); 

    print "ctx.fillStyle = \"#41BFFF\";"; //rect colour 
    print "ctx.shadowOffsetX = 4;"; 
    print "ctx.shadowOffsetY = 4;"; 
    print "ctx.shadowBlur = 1;"; 
    print "ctx.shadowColor = \"rgba(0, 0, 0, 0.5)\";"; 
    print "ctx.fillRect($start_pos,$ITEM_POSITION_CANVAS,($end_pos - $start_pos),$RECT_HEIGHT);"; //draw rectangle 

    drawexonlines($x, $end_positions, $start_first_exon, $end_last_exon, $new_range_min, $new_range_max, $start_pos, $line_offset); 
} 

printtargets($target_pos_split_start, $start_first_exon, $target_pos_split_end, $end_last_exon, $new_range_min, $new_range_max, $ITEM_POSITION_CANVAS, $RECT_HEIGHT); 

print "</script>"; 
} 

感謝

回答

1

不太可能你會得到這樣一個堅實的答案,因爲它是一個意見基礎問題(編碼風格),是相當廣闊。

這樣說的話,我會建議嚴厲反對這種編碼風格。沒有真正的理由像這樣編寫代碼 - 它很乏味,甚至你的例子也有錯誤。沒有看到更多的代碼,很難理解爲什麼你需要用PHP編寫這種類型的邏輯,以及爲什麼不能純粹用JavaScript編寫。


如果您需要從PHP數據傳遞到JavaScript的你可以echo值到JS變量。使用JSON作爲橋樑是將PHP數據轉移到JS的一種乾淨方式,並創建基本對象來處理。這是一個簡單的例子。

<?php 
    $phpVal = array(
    'numbers' => 7, 
    'strings' => 'hello', 
    'arrays' => array('one', 'two'), 
    'objects' => array('property' => 'value') 
); 
?> 

.. 

<script> 
    var jsVal = JSON.parse(<?php echo json_encode($phpVal); ?>); 
    console.log(jsVal.numbers); // >> 7 
    console.log(jsVal.strings); // >> "hello" 
    console.log(jsVal.arrays); // >> ["one", "two"] 
    console.log(jsVal.objects); // >> Object {property: "value"} 
</script> 

考慮使用這種模式與您需要的所有數據創建對象,然後你可以定期編寫JavaScript中使用。


一些閱讀材料。

PHP

JS


旁註:

需要添加Java函數

JavaScript的== Java的!不要弄錯這兩種語言,它們不是直接有關。如果您需要JavaScript的簡寫,請將其稱爲JS。參考JS函數java函數簡直是不正確的。

+0

感謝您的反饋!肯定幫了很多! –