Google Maps Style

程式技術 2015/07/28 17:17
views: 1433 times
Google Maps 大家很常用吧. 在做一些結合 Google Maps 的應用時, 有時會希望能把上面的圖示簡化, 或是一些圖示的顏色改變, 要如何進行呢?

可以使用 Google Maps API Styled Map Wizard: http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html

這個 Wizard 可以快速的開關與調整圖示的顯示與否與改變顏色, 設定好後, 再產生出 JSON 格式的描述檔, 就可以自訂 Sytle 的 Google Maps.

例如要所有的水都消失:

[ { "featureType": "water", "stylers": [ { "visibility": "off" } ] } ]

以此類推, 一方面預覽一方面快速產出對應的描述檔, 很快速地建立自訂的 Google Maps.

不過若是想要找一些現成的, 可以利用這個服務:
https://snazzymaps.com/

上面已經有現成的許多格式可供套出, 一樣是產生 JSON 格式的描述檔供應用.

需要更詳細的自訂Google Maps Style可以參考Google 的官方文件:
https://developers.google.com/maps/documentation/javascript/styling
top

CSS寬度問題

程式技術/Javascript 2015/07/23 14:43
views: 6012 times
今天在修正一個瀏覽器相容性問題時, 在使用 css 中的 calc(100%- 10px) 這樣的語法時, 由於 ie8 不支援, 所以改用 jQuery 的 obj.parent().width() 來進行設置.

測試後發現有一點落差, 起用 browser 的 box model 來檢查, 發現其中 parent 有設定左右的 padding, 導致 parent width 和原來的 css calc(100% -10px) 的 100% 會有落差, 所以查了一下 jQuery 語法, 使用 obj.parent().outerWidth() 就能順利取得和原來 css calc(100% -10px) 的 100% 寬度相同了.

如此一來就解決了在 ie8 下寬度使用 calc(100% -10px) 語法的問題.
top

MySQL資料表不存在的資料就新增-存在就忽略(或異動)的語法

程式技術/Database 2015/07/17 15:27
views: 10576 times
在新增資料於資料表時, 有個需求, 是不存在的資料就新增, 存在的資料就不動作(或是要處理一些異動), 這樣的需求如何操作呢?

可以使用 INSERT IGNORE INTO [table] ..... 的語法,

若是要異動則使用

INSERT INTO [table]..... ON DUPLICATE KEY UPDATE col=expr .....

可以參考以下語法:
http://cain19811028.blogspot.tw/2015/01/mysql-insert-ignore-replace-on.html
https://mariadb.com/kb/en/mariadb/insert-on-duplicate-key-update/
top

bootstrap的datetime picker

程式技術 2015/07/14 12:21
views: 12237 times
在 bootstrap 下使用的 datetime picker 有不少, 不過簡單一點的可以參考這個:

http://www.malot.fr/bootstrap-datetimepicker/

主要是代碼短小, 使用起來也十分容易, 操作也很順手, 是個方便好用的 datetime picker.

若有在查找 bootstrap 的 datetime picker 這個會是一個不錯的選擇. (同時支援 bootstrap 2 與 bootstrap 3)

github: https://github.com/smalot/bootstrap-datetimepicker
top

可愛的ClockPicker-用時鐘方式來選取時間

程式技術/Javascript 2015/07/07 11:56
views: 16757 times
這個專案組件很可愛, 是一個時間選取器, 呈現的介面就是一個時鐘, 操作起來還蠻方便的, 另外也在手機上測試操作看看, 也是一樣方便順手, 蠻有意思的.

用戶插入圖片


有需要使用到 timepicker 的場合, 可以試看看這組 clockpicker , 很不錯.

有 bootstrap版本: http://weareoutman.github.io/clockpicker/
還有 jQuery 版本: http://weareoutman.github.io/clockpicker/jquery.html



top

PREV : [1] : [2] : [3] : [4] : [5] : ... [81] : NEXT



ASUS ZENBOOK UX305FA(MS) 13.3吋AC筆電(M-5Y10/4G) ASUS ZenPad 8.0 Z380C 8吋四核平板 (WiFi/16G) TAKARA TOMY - 隨身啤酒泡打器(白) 混血營英雄(全五冊) SanDisk SSD Ultra II 固態硬碟(7mm)120G 含9.5mm用厚墊 SanDisk SSD Ultra II 固態硬碟(7mm)240G 含9.5mm用厚墊 QNAP TS-251-4G 網路儲存伺服器 SONY Xperia Z4 Tablet 10吋八核平版(32G /WiFi) SanDisk Ultra microSD UHS-I 64GB 記憶卡(公司貨)30MB SanDisk Extreme microSD U3 32GB 記億卡 (公司貨) 60M SanDisk Extreme microSD U3 64GB 記億卡 (公司貨) 60M ASUS華碩 AC1900 雙頻無線路由器 RT-AC68U ASUS Zenfone 2 ZE551ML (4G/32G) 5.5吋FHD四核心智慧手機 美國Impress coffee brewer手沖咖啡保溫杯(銀/黑兩色) SanDisk iXpand 儲存裝置 32GB (公司貨) iPhone / iPad 【64G-金】Apple iPad Air 2 WiFi版 64G-金色 HTC One M9 32G 5吋八核心全新旗艦機 HTC One M9 32G 5吋八核心全新旗艦機 任天堂 FC30 GamePad 紅白機復古無線手把 TP-LINK Archer C9 AC1900 Gigabit 無線路由器 快譯通EC208 電子辭典 翻譯機 SiliconPower 廣穎 1TB D10 USB3.0 行動硬碟 HTC One M8 16G 5吋四核心全新旗艦機 SAMSUNG WB350F 21倍光學變焦超廣角數位相機(公司貨) Nikon P530 42倍變焦類單機(平輸中文) Nikon coolpix P530  42倍光學變焦(公司貨) Sapido 精巧型網卡、無線網卡、無線分享三享機(BRD70n) aibo OTG113 多彩帶線OTG傳輸充電/讀卡機 EPSON LW-600P智慧型藍牙手寫標籤機 美國 VORNADO 533 渦流空氣循環機 (黑色) ASUS ZenFone 5 A501 5吋雙卡雙待智慧手機 【PAFERS】XSPIN-藍芽運動裝置 35合1掌上型麻將機2代 Verbatim 威寶 OTG 16GB microUSB+USB3.0 雙介面高速隨身碟 HP LaserJet Pro CP1025nw 無線迷你彩色雷射印表機 ZyXEL合勤 電力線傳輸設備PLA4201(雙包裝) 每朝健康 黃金燕麥茶-無糖(550mlx24入) 每朝健康 爽酷飲料(590mlx24入) 御茶園 每朝健康烏龍茶(650mlx24入) 御茶園 每朝健康綠茶(650mlx24入) (84折後價$92)每朝健康 雙纖綠茶(650mlx4入) 每朝健康 雙纖綠茶(650mlx24入) 鈴木鑽石海綿-淋浴門水垢剋星M(輕巧型) IWATANI 岩谷 4.1KW 卡式瓦斯單口爐 附硬盒收納 AH-41 SONY 32G microSDHC UHS-I C10(40MB/S)記憶卡 威寶 32GB microSDHC Class10 記憶卡 (含轉卡) D-Link 500Mbps電力線網路橋接器DHP-500AV Electrolux伊萊克斯 義式咖啡機 (EES200E) 獅子心-十二生肖營養蛋糕機 (LCM-123) SONY Xperia Z3 D6653 5.2吋四核心高感光旗艦機 InfoThink IT-925U ATM多合一讀卡機 (MINI純白新機) 快譯通EC208 電子辭典 翻譯機 米雅可  #304不鏽鋼三件式調理鍋組(16.18.22cm) Verbatim威寶 GT 2TB USB3.0 2.5吋超跑行動硬碟(雙色) 羅技 Multimedia Speakers Z213 2.1 聲道喇叭 ★羅技有線滑鼠M105-三色選 CODYSON 超音波清洗機 _ CD-5800 Panasonic國際牌15公斤變頻洗衣機NA-V168AB-P Panasonic國際牌14公斤變頻洗衣機NA-V158ABS-S


 Waiting...