AAChartKit
AAChartKit copied to clipboard
折线图的十字线带个柱状的背景


- (AAOptions *)customizeOptions {
AAChartModel *aaChartModel = AAChartModel.new
.chartTypeSet(AAChartTypeAreaspline)//图表类型
.yAxisLineWidthSet(@0) // Y轴轴线线宽为0即是隐藏Y轴轴线
.yAxisLabelsEnabledSet(false)
.yAxisGridLineStyleSet([AALineStyle styleWithWidth:@0])//y轴横向分割线宽度为0(即是隐藏分割线)
.yAxisPlotLinesSet(@[AAPlotLinesElement.new
.colorSet(@"#ECECEC")//颜色值(16进制)
.dashStyleSet(@"Solid")//样式:Dash,Dot,Solid等,默认Solid
.widthSet(@(0.5)) //标示线粗细
.valueSet(@(10000)) //所在位置
.zIndexSet(@(1)) //层叠,标示线在图表中显示的层叠级别,值越大,显示越向前
.labelSet(AALabel.new
.textSet(@"10000")
.styleSet(AAStyleColor(@"#C1C7D0")))])
.dataLabelsEnabledSet(false)
.tooltipEnabledSet(true)
.markerRadiusSet(@0)
.xAxisCrosshairSet([AACrosshair crosshairWithColor:@"#47D187"// 准星线
dashStyle:AAChartLineDashStyleTypeDot
width:@1])
.legendEnabledSet(false)
.categoriesSet(@[@"Mon",@"TUE",@"WED",@"THU",@"FRI",@"SAT",@"SUN",])
.seriesSet(@[
AASeriesElement.new
.lineWidthSet(@2)
.colorSet(@"#47D187")
.fillOpacitySet(@0)
.dataSet(@[@13289, @6421, @9483, @4321, @3753, @2321, @8968])
.statesSet(AAStates.new
.hoverSet(AAHover.new
.haloSet(AAHalo.new
.sizeSet(@5)
.opacitySet(@1)
.attributesSet(@{
@"stroke-width": @3,
@"fill": @"#ffffff",
@"stroke": @"#ffffff"
}))))
.markerSet(AAMarker.new
.statesSet(AAMarkerStates.new
.hoverSet(AAMarkerHover.new
.fillColorSet(@"#47D187")
.radiusSet(@2.5)
.lineWidthSet(@0))))
]);
AAOptions *aaOptions = aaChartModel.aa_toAAOptions;
AATooltip *tooltip = aaOptions.tooltip;
tooltip
.animationSet(false)
.useHTMLSet(true)
.formatterSet(@AAJSFunc(function () {
return this.y;
}))
.paddingSet(@2)
.backgroundColorSet(@"#47D187")
.borderRadiusSet(@3)
.shadowSet(false)
.styleSet(AAStyleColorSize(@"#FFFFFF", 16));
return aaOptions;
}
不支持此设计.
Highchart 只能有准星线, 或者是将准星线的宽度加宽, 改成这种柱状背景效果. 但是不支持既有准星线又有柱状背景.
不支持此设计.
Highchart 只能有准星线, 或者是将准星线的宽度加宽, 改成这种柱状背景效果. 但是不支持既有准星线又有柱状背景.
明白了,我去试试。多谢大佬!大佬再想问一下,多条折线的情况下,选中会默认选择所有的线。我需要隐藏掉tooltip,通过.tooltipEnabledSet(false)现在变成就只能选择一条线了,那我该怎么隐藏呢