Question

我有一张使用Shinobi的圆环图。但根据数据标签重叠!!

其中一个标签没有完全显示（最大付款）。

我搜索了整个堆栈溢出，无法找到解决方案。在Shinobi网站或其文档中也没有关于这个问题。

这是我的代码：

import UIKit

class MyViewController: UIViewController, SChartDatasource {
    var donutChartValues:[Double] = []
    var donutChartLabels:[String] = []
    @IBOutlet weak var chartView: UIView!

    override func viewDidLoad() {
        super.viewDidLoad()
        redrawChart()
    }

    func redrawChart() {
        setDonutChartValues()
        let chart = ShinobiChart(frame: chartView.bounds)
        chart.autoresizingMask = [.flexibleHeight, .flexibleWidth]
        chart.backgroundColor = UIColor.clear
        chart.datasource = self
        chartView.addSubview(chart)
    }
    func setDonutChartValues () {
        donutChartValues.removeAll()
        donutChartLabels.removeAll()
        donutChartValues.append(2500.00)
        donutChartLabels.append("Max Payment")
        donutChartValues.append(300.0)
        donutChartLabels.append("Property Tax")
        donutChartValues.append(100.0)
        donutChartLabels.append("Condo Fees")
        donutChartValues.append(150.0)
        donutChartLabels.append("Heating Costs")
        donutChartValues.append(300.0)
        donutChartLabels.append("Debts")
        donutChartValues.append(4000.0)
        donutChartLabels.append("Other Expenses")
    }

    /********************************************************************************/
    // MARK: - SChartDatasource methods
    /********************************************************************************/

    func numberOfSeries(in chart: ShinobiChart) -> Int {
        return 1
    }

    func sChart(_ chart: ShinobiChart, seriesAt index: Int) -> SChartSeries {
        let donutSeries = SChartDonutSeries()
        donutSeries.style().spokeStyle.showSpokes = true;
        donutSeries.selectedStyle().spokeStyle.showSpokes = true;
        donutSeries.style().labelFontColor = UIColor.black
        donutSeries.selectedStyle().labelFontColor = UIColor.black
        return donutSeries
    }

    func sChart(_ chart: ShinobiChart, numberOfDataPointsForSeriesAt seriesIndex: Int) -> Int {
        return donutChartValues.count
    }

    func sChart(_ chart: ShinobiChart, dataPointAt dataIndex: Int, forSeriesAt seriesIndex: Int) -> SChartData {
        let dp = SChartDataPoint()
        dp.xValue = 0
        dp.yValue = (donutChartValues.count > dataIndex) ? donutChartValues[dataIndex] :  0
        return dp
    }

    func sChart(_ chart: ShinobiChart, labelForSliceAt sliceIndex: Int, in series: SChartRadialSeries) -> UILabel? {
        let sliceLabel = UILabel()
        sliceLabel.text = (donutChartLabels.count > sliceIndex) ? donutChartLabels[sliceIndex] :  ""
        return sliceLabel
    }
}

任何帮助都将不胜感激。

Answer 1

我相信你想要的是sChart:alterLabel:forDatapoint:atSliceIndex:inRadialSeries:NS_SWIFT_NAME:协议的SChartDelegate方法。

根据此方法的the documentation，它会在每个饼图/甜甜圈系列添加到图表之前为每个饼图/甜甜圈系列提供每个标签。使用此选项设置颜色，边框或 重新定位标签 。＆＃34; （重点补充）。

这个blog article给出了如何实现它的示例。

Answer 2

正如Mike Traverse建议的那样，调整标签中显示的文本的推荐方法是使用sChart:alterLabel:forDataPoint:...委托方法。这可以防止您自己创建标签，而只需调整标签的文本即可显示您想要的值，例如：

func sChart(_ chart: ShinobiChart,
                alter label: UILabel,
                for datapoint: SChartRadialDataPoint,
                atSlice index: Int,
                in series: SChartRadialSeries) {
     label.text = datapoint.name
}

您需要分配图表的委托，然后稍微更改返回数据点的数据源方法：

func sChart(_ chart: ShinobiChart, dataPointAt dataIndex: Int, forSeriesAt seriesIndex: Int) -> SChartData {
        let dp = SChartDataPoint()
        dp.xValue = donutChartLabels[dataIndex]
        dp.yValue = (donutChartValues.count > dataIndex) ? donutChartValues[dataIndex] :  0
        return dp
}

该系列应该将所有标签保持在图表的范围内，我担心我无法复制您所看到的支付标签被剪裁的问题。你确定图表视图没有超出屏幕范围吗？（检查此方法的一个好方法是使用View Debugging工具）。

甜甜圈系列没有做任何事情来防止辐条标签重叠。如果您希望显示数据点的辐条，这些数据点是甜甜圈系列的一小部分，那么您不得不创建自己的实现来阻止重叠发生。我肯定会向团队提及此问题，我们会考虑在将来的版本中添加此功能。

另一种解决方案可能是隐藏与小值相对应的辐条，使它们与相邻值重叠。您可以使用SChartDonutSeries方法setSpokeStyle:forSpokeAtSliceIndex:逐个切片地执行此操作。不过，我很欣赏它不是一个完美的解决方案。

只是为了将来参考，如果您可以在forum上询问与未来有关shinobi相关的问题，那就太棒了 - 这样可以更加轻松地确保我们尽快回答您的问题并查看以下内容你可能有的问题。

Shinobi甜甜圈图表标签重叠

2 个答案: