Swift写的一个折线图

最近做项目的时候，遇到需要做一个折线图的需求。

做好之后像下图。

折线图.png

使用的时候只需要三个代理函数：
调用界面：

class ViewController: UIViewController {

    var dataSource:[CGFloat] = [CGFloat]()
    var titleSource:[String] = [String]()
    override func viewDidLoad() {
        super.viewDidLoad()
        
        self.dataSource = [645,546,695,654,2666,1954,956,4265]
        self.titleSource = ["6月1号","2","3","4","5","6","7","8"]

        let v:FBLineChartView = FBLineChartView.init(delegate: self)
        v.Y = 100
        self.view.addSubview(v)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

代理函数：

extension ViewController:LineChartViewDelegate{
    /// 单位字符
    ///
    /// - Returns: 垂直单位字符
    func verticalUnitText() -> String {
        return "/美元"
    }
    
    ///  底部水平上的展示文字
    ///
    /// - Parameter index: 位置，从左至右 0-N N取决于设定的默认格栅数
    /// - Returns: 展示文字的内容
    func horizontalText(atIndex index:NSInteger)->String{
    
        return self.titleSource[index]
    }

    /// 图表中的值
    ///
    /// - Returns: 展示
    func values() -> [CGFloat] {
        return self.dataSource
    }
}

效果：

初始设置.png

解释

• 竖直方向的 标识 区段会由给的数值计算出来。

区段.png

• 内部可以调节每个细节的颜色。有以下方法可调用。

// MARK: - 颜色初始化设置
extension FBLineChartView{
    /// 设置背景色
    func setBackGColor(_ color:UIColor = UIColor.init(RGBA: DefaultBackgroundColor)) {
        self.backgroundColor = color
    }
    /// 设置虚线的颜色
    func setDashLineColor(_ color:UIColor = UIColor.init(RGBA: DefaultDashLineColor)){
        self.dashColor = color
    }
    /// 设置折线的颜色
    func setCrossLineColor(_ color:UIColor = UIColor.init(RGBA: DefaultCrossLineColor)){
        self.crossColor = color
    }

    /// 设置 区段 和 下方 时序文字的颜色
    func setAnnotateTitleColor(_ color:UIColor = APPLINECOLOR){
        self.annotateTitleColor = color
    }
    
    /// 设置单位的颜色
    func setUnitColor(_ color:UIColor = APPGRAYBLACKCOLOR) {
        self.unitColor = color
    }
    /// 设置遮罩颜色
    func setMaskColor(_ color:UIColor = APPGRAYBLACKCOLOR){
        self.maskColor = color
    }
    
    /// 隐藏水平虚线
    func hiddenHorLine(_ isHidden:Bool){
        self.scrollView.hiddenHorLine(isHidden)
    }
    
    /// 隐藏垂直虚线
    func hiddenVerLine(_ isHidden:Bool){
        self.scrollView.hiddenVerLine(isHidden)
    }

    /// 设置折线点的颜色
    func chartPointColor(_ color:UIColor){
        self.scrollView.chartPointColor(color)
    }
    
    /// 设置数值的颜色
    func setValueTitleColor(_ color:UIColor){
        self.scrollView.vallueTitleColor(color)
    }
}

• 刷新数据。
  如果需要刷新数据，只需要像下面这样，修改相应的设置，然后调用refreshUIData即可

            self.dataSource = [20,56,84,92,41,65,48,62]
            v.setBackGColor(UIColor.init(RGBA: "#008B8B"))
            v.setUnitColor(UIColor.red)
            v.refreshUIData()

刷新结果：

刷新后1.png

刷新后2.png

• 缺点： 没有做复用机制，如果是数据量太多的话，会导致内存使用增加。测试 1000个数据的话大概会多出40M的使用内存。同时会带来性能上的影响。处理方式：可以采用刷新机制，单批处理数据。

最后git地址： https://github.com/lufubinGit/LineChart