2012年3月30日 星期五

峰駝式的命名方式

在學action script的時候，常常會遇到變數這樣命名
var nowPeople
var ageBoy
var numOfApple
上面只是的參考，也就是說 形式上是這樣

  • 小駝峰式命名法（lower camel case）：
第一個單字以小寫字母開始；第二個單字的首字母大寫，例如：firstName、lastName。
  • 大駝峰式命名法（upper camel case）：
每一個單字的首字母都採用大寫字母，例如：FirstName、LastName、CamelCase，也被稱為Pascal命名法。

這就是峰駝式的命名方式(camel case)
這樣的變數命名方式是為了要讓程式好讀 淺顯易懂

峰駝式的命名大有學問 ~




參考:
於 1 則留言:

Hello world的由來

hello world在很多的程式教科書或工具書都會出現?
恩.... 大家都不會好奇為什麼都是用hello world來當作範例嗎? = =

其來有自，詳情請看~
http://caterpillar.onlyfun.net/Gossip/StudyGossip/HelloWorld.html
原來C語言的前身是B語言

世界上還有D語言 ...
維基百科的介紹:
http://zh.wikipedia.org/wiki/D%E8%AA%9E%E8%A8%80 
於 沒有留言:

2012年3月23日 星期五

好用的全字庫




















今天上數位典藏的時候學到一個很實用的網站
而且還是我從來不知道的知識xd
那就是全字庫~~




















http://www.cns11643.gov.tw/AIDB/welcome.do
STEP:
左方連結列 "字碼查詢與下載" 選擇其中一種查詢方式，如要找楠 可以用注音查詢打楠的音
來找到這個字。
不論用何種方式查詢，找到字之後，可以看到"歷代碑帖"的下拉選單，按下開始搜尋就可以了。





















有時候做作業的時候總是覺得字體都是電腦灌的那幾種
換台電腦還會發現沒有相同的字體
僅能只用微軟內建xd
當電腦沒有其他類似書法字體的時候可以去下載字體的png來做很多美工的效果
像今天上的數位典藏課就是使用全字庫的字體(下載時可以選擇png檔或是psd 非常好用)
來實作Flash的字體效果


於 沒有留言:
標籤：

2012年3月22日 星期四

PHP 亂數出題

以亂數的方式產生考題
1. 以亂數選取考題
2. 必須避免輸出同樣的題目
於 沒有留言:
標籤：

2012年3月18日 星期日

PHP - 迴圈radio選項


<?php
//將題目建立為字串陣列
$question = array("1.問題一 ?","2.問題二?","3.問題三?","問題四","問題五","問題六");
//將結果選項建立為陣列
$ansopt = array("很不錯","不錯","尚可","糟透了");
?>

<form action="XXXX.php" method="POST">
<?php
//第一層for 迴圈用於輸出問卷題目
for($i=1;$i<=6;$i++)
{
?>
<?echo $ question [$i-1]?> //-1是因為陣列的第一項是從0開始計算
<?
//第二層for迴圈用於輸出問卷題目的選項
for($j=1;$j<=4;$j++)
{
?>
<input type="radio" name=<?echo "radio".$i;?> value="<?echo $j?>">
<?echo $ ansopt  [$j-1]?>
<?
}
?>

<?php
}
?>
<br/>
<input type="submit" value="送出問卷">
</form>

於 沒有留言:
標籤：

2012年3月17日 星期六

PHP 2012-3-14上課筆記

取得表單變數的方法
1.   $_POST['表單變數'];
2.   $_GET['表單變數'];

PHP語法中
前面有 $_ ($+underline的)  如 $_FILE . $_COOKIE .$_POST..等等
總之前面有$_的後面的字一律是大寫
這是內建函數值

於 沒有留言:
標籤：

2012年3月11日 星期日

PHP mysql_data_seek( )

使用mysql_data_seek( )
所連結資料庫一定要有資料 否則會出現錯誤
[function.mysql-data-seek]: Offset 0 is invalid
於 沒有留言:

PHP 檔案

function.move-uploaded-file   error 
可能是後面接的檔案路徑有問題 


$upload_dir = "../temp/";
$upload_file = $upload_dir.iconv("UTF-8","big5",$_FILES["myfile"]["name"]); 
之前是因為路徑打錯 ../temp  打成./temp
所以出現這個error 


iconv("UTF-8","big5",$_FILES["myfile"]["name"]);  是為了解決有中文檔名的問題
iconv() 將有utf-8的檔名轉成big5編碼。


檔案上傳的<form>標籤寫法: 
<form method="post" action="upload.php" enctype="multipart/form-data">
     欄位內容
</form>


檔案資訊的取得函數:
取得檔案名稱: 
$_FILES["myfile"]["name"];
取得檔案類型(類型是指MINE類型):
$_FILES["myfile"]["type"];
取得檔案大小:
$_FILES["myfile"]["name"];
取得檔案暫存檔名:
$_FILES["myfile"]["tmp_name"];
取得檔案錯誤代碼:
$_FILES["myfile"]["error"];


 ps: 錯誤代碼的回傳數值代表意義是:

0
上傳成功
1
檔案大小超過你在php.ini的upload_max_filesize設定 
2
檔案大小超過你在form裡面所設定的MAX_FILE_SIZE的大小 (MAX_FILE_SIZE 是一個隱藏欄位)
3
上傳不完整
4
你沒有選要上傳的檔案





上傳檔案首頁的<form>:
<form method="post" action="upload.php" enctype="multipart/form-data">
       <input type="hidden" name="MAX_FILE_SIZE" value="1048576">
             <input type="file" name="myfile" size="50">
             <br/>
             <br/>
             <input type="submit" value="上傳!">
             <input type="reset" value="重新設定">
</form>


MAX_FILE_SIZE這個隱藏欄位設定上傳檔案的大小，不可超過1MB(1024*1024) 
優點 是 允許可以在網頁上設定上傳的限制
這個欄位一定要在input type="file" 之前

於 沒有留言:
標籤：

2012年3月10日 星期六

PHP GD筆記(2)-圓的練習


PHP GD筆記(2)-圓的練習










<?php
header("Content-type:image/png");
$im = imagecreatetruecolor(1000,200);
$yellow = imagecolorallocate($im,255,255,0);
$white = imagecolorallocate($im,255,255,255);
$red = imagecolorallocate($im,255,0,0);
$black = imagecolorallocate($im,0,0,0);
$orange = imagecolorallocate($im,255,165,0);
$hotpink = imagecolorallocate($im,155,105,180);
imagefill($im,0,0,$yellow);
imagefilledellipse($im,100,100,199,199,$red);
imagefilledellipse($im,300,100,199,199,$black);
imagefilledellipse($im,500,100,199,199,$white);
imagefilledellipse($im,700,100,199,199,$orange);
imagefilledellipse($im,900,100,199,199,$hotpink);
imagepng($im);
imagedestroy($im);
?>

NOTE:

imagecreatetruecolor(int x_size, int y_size);
imagecreate(int x_size, int y_size);
兩種函數都是建立一張空圖片，如同在作畫之前鋪一張畫布一樣
差別在於 imagecreate 只支援256色 而 imagecreatetruecolor 支援百萬色

imagecolorallocate(resource image,int red,int green,int blue);
這是一的準備調色盤的函式
RGB的值可以是0~255;
他可以呼叫很多次
第一呼叫的色彩，預設為黑色
往後呼叫的的都可以當作是不同顏色的顏料，準備起來放著 在後面填滿顏色時再使用

imagefill(resource image,int x,int y);
填滿顏色

imagefilledellipse(resource image, int cx, int cy, int width, int height,int color);
if int width = int height 則為畫出圓形

imagepng (recource image);
輸出png圖檔，這是一種只輸出在瀏覽器的寫法
切記前面一定要加header()
也有可以把圖檔存起來的方法
imagepng(resource image,"img/test.png");
如 : imagepng($im,"img/test.png"); 則會存在img資料夾且檔名為test.php

PHP GD筆記(3)-貼入圖片+圖片上寫文字






<?

/*-----------------讀取外部圖片--------------------*/
$image = imagecreatefromjpeg("002.jpg");
$textwhite = imagecolorallocate($image,255,255,255);
//在圖片加入使用者資訊
imagestring($image,5,500,60,"photo by win",$textwhite);
imagestring($image,4,500,80,"photo by win",$textwhite);
imagestring($image,3,500,100,"photo by win",$textwhite);
imagestring($image,2,500,120,"photo by win",$textwhite);
imagestring($image,1,500,140,"photo by win",$textwhite);
//輸出圖片  5代表字型大小 有1~5的選擇
header("content-type:image/png");
imagepng($image);
imagedestroy($image);
?>
於 沒有留言:

2012年3月9日 星期五

PHP GD筆記


產生一塊500*500的紅色方塊

<?php
header("Content-type:image/png");
$myimg = imagecreate(500,500);
$color = imagecolorallocate($myimg,255,0,0);
imagepng($myimg);
?>





在畫面上畫一個800*800的正方型 
<?php
header("Content-type:image/png");
/*echo "<h1>顯示GD_info資訊</h1><br/>";
var_dump(gd_info())."<br/>";

echo "<br/><h1>開始畫</h1>";
*/
$width = 800;
$height = 800;
$canvas = imagecreate($width,$height) or die ("無法顯示圖片");
//imagecreate()-想像成做畫時所需要的一張畫布
$background_color = imagecolorallocate($canvas,238,162,173);
//設定背景顏色

//imageline($canvas, $x1,$y1,$x2,$y2,$line_color); 
imagepng($canvas);
?>

大部分的書都會寫使用gd函式進行繪圖的步驟 : 
步驟大同小異
1. 先建立一張畫布(空圖片) 也就是imagecreate() .  imagecreateturecolor() 也可以拉 書上是這麼寫
2. 決定顏色，這個影像背景色預設是黑色
3. (畫線)
4.輸出圖片
5.釋放記憶體空間


header( ) 函數是個很難取悅的函數，這一行是不能省略的，因為必須告訴文件你是圖片，否則出現亂碼，
我的就這樣 �PNG IHDR�� ��<� PLTEH��Y IDATx����à�S_�U | P ڠ �IEND�B`��PNG IHDRdd J, PLTE���'` IDATx�c` �` ��Q@O x �E�IEND�B`，
亂七八糟的一堆東西跑出來。

我曾經試過把header("Content-type:image/png"); 裡面的image打錯 ，打成images，結果變成google chrome 把這個php給下載下來了 = =

如果將echo (綠色文字區域) 顯示執行，就會出現討人厭叉燒包
imagecreate 有沒有加@結果一樣
函數後面是( ) ，前面沒有$  我以為那是變數xdd


參考資料:
RGB 色票表 http://www.wahart.com.hk/rgb.htm
網路教學  http://big5.webasp.net/article/7/6036_print.htm

於 沒有留言:
標籤：

2012年3月6日 星期二

GOOGLE MAP 的API使用(Javascript API)


GOOGLE MAP API的使用 
在網頁上內嵌GOOGLE MAP好像也不是一件很難的事情，
就先到Google map 然後指定地點，複製他產生的<iframe>標籤或是href貼到網頁程式碼就可以了。  不過我現在看的這本書是在講如何在網頁中內嵌地圖的API


(以下說明來自GOOGLE MAP API說明) 

Google Maps API 提供開發人員數種將 Google 地圖嵌入網頁的方式，可以簡單使用或再自行大幅修改。我們目前提供數種 API：
1.Google Maps Javascript API
2.Google Maps API for Flash
3.Google Static Maps API
 這些 API 可以單獨使用或加以組合，滿足您的各種需求。
 如果您是經營企業或商業網站的使用者，您可能也想瞭解 Google Maps API Premier。


可以到官網去參考他的使用方式。http://code.google.com/intl/zh-TW/apis/maps/faq.html#whatis


1.Google Maps Javascript API
就是用javascript內嵌google map API到網頁裡。
目前已經發展到第三版，並且支援行動裝置。
顧名思義第二種API for Flash就是用actionscript API 



在網頁中顯示google map API的步驟 : 


更多詳情請見 Google Maps Javascript API 第 3 版地方資訊程式庫 (實驗性)




1. 在<head>標籤裡內嵌 Maps JavaScript API -->
<script type="text/javascript" src="../jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>
2. 建立一<div>標籤顯示google地圖  -->

<div id="mymap" style="width:500px; height:500px;"></div>


3. 設定相關選項 -->
var latlng 設定經緯度
var myOptions  設定縮放比例.中心的經緯.顯示類型
var map 定義單一地圖
4. 載入 。
詳見下方說明



說明: 
1. 在<head>標籤裡內嵌 Maps JavaScript API

根據google的說明 
 首先必須內嵌這個javascript的檔案:


<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=true_or_false"></script>

請不要直接把這一整具貼上去html文件裡，因為你必須去設定後面的sensor
，否則會出現錯誤。






後面所帶的  sensor=true_or_false  
這裡的sensor 顧名思義就是感應器，例如GPS定位器
如果你希望在行動裝置去判斷使用者的位置
那請將sensor設定為true。還有很重要的一點，來自於 google網站說明: 
請注意，即使您的應用程式沒有使用位置感應器，您仍必須設定 sensor 參數 (在此情況下，請設定為 false)。



2. 建立一<div>標籤顯示google地圖 
<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script><!-- 匯入jquery-->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=true"></script>
</head>

<body>
<!-- 測試一個區塊-->
<div style="width:500px;height:500px;background-color:green">綠綠的</div>
</body>
</html>


3. 設定相關選項 

這裡所說的相關選項只是地圖的一些設定。
我看了一下官方的說明文件，這裡的選項不外乎就是一些你必須去初始畫的東西。比方說，你必須在使用地圖的時候一開始就要去設定最初的經緯度是多少。
看一下google的地圖選項說明:
「為了初始化地圖，我們會先建立 Map options 物件以納入地圖初始化變數。我們不會建構這個物件，而會以物件實字形式建立這個物件。因為我們想將地圖中心鎖定在特定的點，所以也會建立 latlng 值來存放這個位置」

  • 緯度是 lat (變數)
  • 經度是 lng(變數)


用latlng存放這個位址就是這樣: (jquery寫法)
 <script>
 $(document).ready(function(){
  var latlng = new google.maps.Latlng(22.732709,120.287507);
 });
</script>


  • Map options物件的建立:


map option 幾個常用的就是zoom .center mapTypeld 。
zoom: 地圖顯示的比例，總共有18個 從0~17
center: 顧名思義就是地圖中心。值就是經緯度設定的 latlng
mayTypeld : 請看google說明




mapTypeId 支援的類型如下：
·         ROADMAP 顯示 Google 地圖的正常、預設 2D 地圖方塊。
·         SATELLITE 顯示圖形地圖方塊。
·         HYBRID 會顯示圖形地圖方塊和特殊圖徵 (道路、城市名稱) 地圖方塊圖層的混合圖。
·         TERRAIN 會顯示實際起伏的地圖方塊，以展現地形高度和水域圖徵 (山嶽、河流等)。



*第 3 版沒有預設地圖類型。您必須具體設定初始地圖類型


var myOptions = {
 zoom: 12,
 center: latlng,
 mapTypeId: google.maps.MapTypeId.ROADMAP
};

4. 載入 

載入應該是最容易忘記的步驟吧xd 以我來說是這樣
 前面弄了老半天狂按F5也不會有結果的xdd

載入地圖的話必須建立這個物件 (一樣貼自於Google)
google.maps.Map - 基本物件

var map = new google.maps.Map(document.getElementById("map_canvas"),
    myOptions);
此類別的物件會定義網頁上的單一地圖 (這個類別可以讓您建立實例，每個物件會在網頁上定義個別的地圖)。我們使用 JavaScript new 運算子來新增此類別的實例。
建立新的地圖實例時，您必須在網頁中指定 HTML 元素 <div> 做為地圖的容器。

就是說 getElementById("map_canvas") 
裡面的map_canvas原本是只建立一個div物件去設定他的canvas
不過我這裡是直接設定div的style長寬
無論如何這裡的map_canvas是要填入div 的id名稱。



測試
 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>



 <script src="http://code.jquery.com/jquery-latest.js"></script>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>

<script type="text/javascript">
 $(document).ready(function(){
  var latlng = new google.maps.LatLng(22.732709,120.287507);
  //變數是小寫latlng， new後面的LatLng 的L是大寫!!! 
  var myOptions = {
    zoom: 15,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  //建立google.maps.Map - 基本物件，定義網頁上的單一地圖
  var map = new google.maps.Map(document.getElementById("mymap"),myOptions);
 });
</script>
</head>

<body>
<!-- 測試一個區塊-->
<div id="mymap" style="width:500px; height:500px;"></div>
</body>

</html>


顯示結果

相關連結 :
參考書目 :
  • jQuery 網頁設計範例教學 - 德瑞工作室- 松崗出版
  • google API 大全 

於 沒有留言:
標籤： , , ,

2012年3月3日 星期六

jQuery練習-demo-isotope同位素網站

isotope這個網站做的東西我覺得很有趣
isotope是元素表吧?!
總之我覺得這個jquery還蠻不錯的，所以就來demo一下
好久沒有這麼熱血一整天弄個東西出來
繼上次以來已經好幾的月了


我先講一下isotope這個套件
其實我最喜歡的就是他這個過濾的功能 用元素表來表示過濾的功能真貼切
這樣的過濾功能能做的就是分類顯示甚麼東西 真的是很實用
isotope英文版的網站在此: http://isotope.metafizzy.co/index.html


isotope網站http://isotope.metafizzy.co/index.html
















ps 雖然網站提供下載使用，並不提供商業用途。
後來我用這個範例提供的basic.html去改變我要的樣子
用班上的人員分組來做過濾的功能
最後在用fancybox的套件來做個人單頁點案後的資料顯示
真的是挺有趣的 呵呵xd
這訣竅就是慢慢用GOOGLE翻譯跟測測什麼id或class影響了什麼
以各種分類來說 
每個人員都是一個<div class="elmenent + 分類名稱">
若以木竹組來說則為  <div class="elmenent  wood">
wood必須事先在css中定義。


練習結果: http://yiying2.ueuo.com/isotope_practice/demos/basic.html
如果無法正確顯示請使用較新版的瀏覽器。

http://yiying2.ueuo.com/isotope_practice/demos/basic.html練習結果
















於 沒有留言:
標籤： , , ,
訂閱： 文章 (Atom)

Vue multiselect set autofocus and tinymce set autofocus

要在畫面一進來 focus multiselect 的方式: 參考: https://jsfiddle.net/shentao/mnphdt2g/ 主要就是在 multiselect 的 tag 加上 ref (例如: my_multiselect), 另外在 mounted...