iOS-Echarts ECharts封装成iOS的控件 项目简介
本项目是将百度的ECharts(echarts2)工具封装成对应的iOS的控件,并且将其中javascript的属性封装成对应的对象。并且提供了链式编程,方面大家进行配置Echarts的属性。方便程序员在编写程序的过程中更加关注OC的代码,避免在使用百度的ECharts工具的过程中过多的关注javascript语法和与javascript之间的交互。 注:如果小伙伴觉得这个工具有用的话,麻烦点一下star,你的star是我继续的动力! 如果你遇到什么问题可以添加一个Issue给我。当然同时欢迎大家给我一个Pull Request。有两种方法可以使用: 通过cocoapods进行导入:pod 'iOS-Echarts' 手动导入: 将项目下的iOS-Echarts目录拷贝到项目中 Remove References移除js目录,然后通过create floder references的方式添加js目录 *** 请确保js目录是蓝色的 *** 在需要使用的地方引入iOS-Echarts.h即可。 最后只需通过对图表的属性进行配置即可。 至于其中的参数与文档可以参考上方的Echart官网中的文档进行查看与配置。 用法 通常的步骤为: // 首先你有一个PYEchartsView的实例
@property (weak, nonatomic) IBOutlet PYEchartsView *echartsView;
...
PYOption *option = ... // 一些关于PYOption配置
// 最后设置配置型以及加载
[_echartsView setOption:option];
[_echartsView loadEcharts]; 所有的属性都可以通过链式的方式进行设置,通过[属性名]Equal来设置 PYOption *option = [PYOption initPYOptionWithBlock:^(PYOption *option) {
option.titleEqual([PYTitle initPYTitleWithBlock:^(PYTitle *title) {
title.textEqual(@"Event River").subtextEqual(@"Test subtext");
}])
.tooltipEqual([PYTooltip initPYTooltipWithBlock:^(PYTooltip *tooltip) {
tooltip.triggerEqual(PYTooltipTriggerItem).enterableEqual(YES);
}])
.legendEqual([PYLegend initPYLegendWithBlock:^(PYLegend *legend) {
legend.dataEqual(@[@"first data", @"second data"]);
}])
.toolboxEqual([PYToolbox initPYToolboxWithBlock:^(PYToolbox *toolbox) {
toolbox.showEqual(YES).featureEqual([PYToolboxFeature initPYToolboxFeatureWithBlock:^(PYToolboxFeature *feature) {
feature.markEqual([PYToolboxFeatureMark initPYToolboxFeatureMarkWithBlock:^(PYToolboxFeatureMark *mark) {
mark.showEqual(YES);
}])
.restoreEqual([PYToolboxFeatureRestore initPYToolboxFeatureRestoreWithBlock:^(PYToolboxFeatureRestore *restore) {
restore.showEqual(YES);
}]);
}]);
}])
.xAxisEqual([[NSMutableArray alloc] initWithArray:@[axis]])
.seriesEqual([[NSMutableArray alloc] initWithArray:@[series1, series2]])
.gridEqual([PYGrid initPYGridWithBlock:^(PYGrid *grid) {
grid.xEqual(@10)
.x2Equal(@30);
}]);
}]; 当然你也可以一个一个的赋值: PYEventRiverSeries *series1 = [PYEventRiverSeries initPYEventRiverSeriesWithBlock:^(PYEventRiverSeries *series) {
series.weight = @123;
series.name = @"Series name";
series.type = PYSeriesTypeEventRiver;
}]; 所有属性都可以通过init[类型]WithBlock来创建: PYAxis *axis = [PYAxis initPYAxisWithBlock:^(PYAxis *axis) {
axis.typeEqual(PYAxisTypeTime).boundaryGapEqual(@[@0.05, @0.1]);
}];
@property (weak, nonatomic) IBOutlet PYEchartsView *echartsView;
...
PYOption *option = ... // 一些关于PYOption配置
// 最后设置配置型以及加载
[_echartsView setOption:option];
[_echartsView loadEcharts]; 所有的属性都可以通过链式的方式进行设置,通过[属性名]Equal来设置 PYOption *option = [PYOption initPYOptionWithBlock:^(PYOption *option) {
option.titleEqual([PYTitle initPYTitleWithBlock:^(PYTitle *title) {
title.textEqual(@"Event River").subtextEqual(@"Test subtext");
}])
.tooltipEqual([PYTooltip initPYTooltipWithBlock:^(PYTooltip *tooltip) {
tooltip.triggerEqual(PYTooltipTriggerItem).enterableEqual(YES);
}])
.legendEqual([PYLegend initPYLegendWithBlock:^(PYLegend *legend) {
legend.dataEqual(@[@"first data", @"second data"]);
}])
.toolboxEqual([PYToolbox initPYToolboxWithBlock:^(PYToolbox *toolbox) {
toolbox.showEqual(YES).featureEqual([PYToolboxFeature initPYToolboxFeatureWithBlock:^(PYToolboxFeature *feature) {
feature.markEqual([PYToolboxFeatureMark initPYToolboxFeatureMarkWithBlock:^(PYToolboxFeatureMark *mark) {
mark.showEqual(YES);
}])
.restoreEqual([PYToolboxFeatureRestore initPYToolboxFeatureRestoreWithBlock:^(PYToolboxFeatureRestore *restore) {
restore.showEqual(YES);
}]);
}]);
}])
.xAxisEqual([[NSMutableArray alloc] initWithArray:@[axis]])
.seriesEqual([[NSMutableArray alloc] initWithArray:@[series1, series2]])
.gridEqual([PYGrid initPYGridWithBlock:^(PYGrid *grid) {
grid.xEqual(@10)
.x2Equal(@30);
}]);
}]; 当然你也可以一个一个的赋值: PYEventRiverSeries *series1 = [PYEventRiverSeries initPYEventRiverSeriesWithBlock:^(PYEventRiverSeries *series) {
series.weight = @123;
series.name = @"Series name";
series.type = PYSeriesTypeEventRiver;
}]; 所有属性都可以通过init[类型]WithBlock来创建: PYAxis *axis = [PYAxis initPYAxisWithBlock:^(PYAxis *axis) {
axis.typeEqual(PYAxisTypeTime).boundaryGapEqual(@[@0.05, @0.1]);
}];