前段時間，做一個跨平台app項目，需要繪制分時圖和K線圖。找了很多開源的js的圖表庫，包括echarts、highcharts等等，都不是很滿意，原因有2：
1、太臃腫，我實際上只要一個分時和一個K線圖表，最多搭配幾個線形圖
2、不滿足需求。主要就是分時圖，國內玩的js圖表庫，幾乎都沒有分時圖。都是用1分鍾線的收盤價線來做的，和中國股民的使用習慣完全不搭界。
多年前有人開源了一個js繪制股票圖形的庫，叫做html54stock，圖像表現上很符合中國人的使用習慣，但是也有問題：
1、封裝不好，很多代碼還在html里寫的，沒有做好封裝
2、繪制的圖像經常有模糊出現，即線條有毛邊
看了一下html54stock的源碼，又梳理了一遍自己的需求，終於決定自己寫一個簡易的庫。
繪制本身不難，主要要處理的就是封裝和線條模糊的問題。封裝就不多說了，以后有機會我也開源出來。這邊文章主要講的就是如何解決模糊問題。
網上有很多文章解釋為什么會模糊，都寫得很好，大家可以參考下面的博文：
http://www.cnblogs.com/lixlib/archive/2012/11/27/2790243.html
我主要做點補充：
1、繪制線條時，采用線條中點定位的方式，所以造成模糊，剛才引用的博文也說得很清楚，只需要坐標偏移到0.5，那么1px寬度的線條就不會出現模糊，
比如畫一個矩形邊框，那么正確的做法就是x和y各偏移0.5，高和寬各縮小1即可，比如，我們要繪制一個20*30的矩形，就應該使用ctx.strokeRect(0.5,0.5,20,30)
2、填充矩形，這個和繪制線條又不一樣了，給定的坐標就真的是填充的邊界，比如剛才舉的例子，ctx.fillRect(0.5,0.5,20,30)，如果這樣調用，肯定是會模糊的
所以這個時候就應該改成ctx.fillRect(0,0,20,30)
canvas繪制模糊的問題，網上有很多大牛已經發過很多文章了，但是提到fillRect的並不多，希望我分享的能幫到大家。