Comments (5)
Highcharts 貌似没有提供这个点击事件的回调功能, 我暂时没找到相关 API, 你可以到 Highcharts 的 GitHub 官方页面提问看看.
from aachartkit-swift.
好的 谢谢 我去看看。
再问一下 图例的点击事件可以获取到吗
from aachartkit-swift.
问:
Highcharts 怎么获取 legend 点击事件回调?
以下是 chatGPT 回答:
在 Highcharts 中,可以通过 legendItemClick
事件来获取 legend 点击事件的回调。当用户点击图例中的一个图例项时,该事件将被触发。
以下是一个示例代码,展示如何使用 legendItemClick
事件回调函数:
Highcharts.chart('container', {
// 图表配置项...
legend: {
// 图例配置项...
itemEvents: {
legendItemClick: function(event) {
// 在这里编写图例点击事件的回调逻辑
console.log('Legend item clicked:', event.target.name);
}
}
},
// 数据系列配置项...
});
在上面的示例中,我们在 legend
配置项中的 itemEvents
对象中定义了 legendItemClick
事件的回调函数。当用户点击图例项时,回调函数将被触发,并且可以访问 event
对象来获取有关点击事件的信息。
在回调函数中,你可以编写任何你想要执行的逻辑。上面的示例中,我们简单地将点击的图例项的名称打印到控制台上。
请注意,上述示例是使用 JavaScript 编写的,如果你需要在其他编程语言中使用 Highcharts,你需要相应地调整代码。
from aachartkit-swift.
回到 AAChartKit-Swift, 在 demo 中, 有自定义 legend
的点击事件的回调的示例, 示例代码如下:
//图表自带的图例点击事件是:
//点击某个显示/隐藏的图例,该图例对应的serie就隐藏/显示。
//个人觉得不合理,正常来说,有多条折线(或其他类型的图表),点击某个图例是想只看该图例对应的数据;
//于是修改了图例点击事件。
//
//实现的效果是(以折线图为例):
//1. 当某条折线隐藏时,点击该折线的图例 --> 该折线显示;
//2. 当全部折线都显示时,点击某个图例 --> 该图例对应的折线显示,其他折线均隐藏;
//3. 当只有一条折线显示时,点击该折线的图例 --> 全部折线均显示;
//4. 其他情况,按默认处理:
//显示 --> 隐藏;
//隐藏 --> 显示;
//Customized legendItemClick Event online: http://code.hcharts.cn/rencht/hhhhLv/share
private func customLegendItemClickEvent() -> AAOptions {
let aaChartModel = AAChartModel()
.chartType(.column)
.stacking(.normal)
.colorsTheme(["#fe117c","#ffc069","#06caf4","#7dffc0"])//设置主题颜色数组
.markerRadius(0)
.series([
AASeriesElement()
.name("2017")
.data([7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]),
AASeriesElement()
.name("2018")
.data([0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]),
AASeriesElement()
.name("2019")
.data([0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]),
AASeriesElement()
.name("2020")
.data([3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]),
])
let aaOptions = aaChartModel.aa_toAAOptions()
aaOptions.legend?
.enabled(true)
.align(.right)//设置图例位于水平方向上的右侧
.layout(.vertical)//设置图例排列方式为垂直排布
.verticalAlign(.top)//设置图例位于竖直方向上的顶部
//自定义图例点击事件
aaOptions.plotOptions?.series?.events = AAEvents()
.legendItemClick(#"""
function(event) {
function getVisibleMode(series, serieName) {
var allVisible = true;
var allHidden = true;
for (var i = 0; i < series.length; i++) {
if (series[i].name == serieName)
continue;
allVisible &= series[i].visible;
allHidden &= (!series[i].visible);
}
if (allVisible && !allHidden)
return 'all-visible';
if (allHidden && !allVisible)
return 'all-hidden';
return 'other-cases';
}
var series = this.chart.series;
var mode = getVisibleMode(series, this.name);
var enableDefault = false;
if (!this.visible) {
enableDefault = true;
}
else if (mode == 'all-visible') {
var seriesLength = series.length;
for (var i = 0; i < seriesLength; i++) {
var serie = series[i];
serie.hide();
}
this.show();
}
else if (mode == 'all-hidden') {
var seriesLength = series.length;
for (var i = 0; i < seriesLength; i++) {
var serie = series[i];
serie.show();
}
}
else {
enableDefault = true;
}
return enableDefault;
}
"""#)
return aaOptions
}
代码运行成功后的在线示例:
当然, 你也可以在 AAChartKit-Swift 的 demo 中运行查看自定义 legend 的点击事件的效果.
from aachartkit-swift.
但是如果你想获取 legend
点击事件回调信息, 并且将回调信息传给原生的 Swift, 代码写起来还挺啰嗦的.
由于 legend 本身的绘制没有多少复杂度, 你完全可以隐藏图表自身的 legend 的, 然后使用 UIView 自定义一个原生的 legend, 然后自行处理相关的点击事件.
from aachartkit-swift.
Related Issues (20)
- AAPlotLinesElement可以支援拖曳Drag嗎? HOT 6
- Charts are not showing at all
- 移动crosshair偶尔会回弹 HOT 3
- log打印能自定义开启或者关闭吗
- 是否可以支持这个效果? HOT 3
- There is no option to hide log while debugging
- 咱们是否支持自定义的Tooltip样式?如下图 HOT 3
- 请问下雷达图里 怎么实现 Y轴的最外一边是实线,里面的线是虚线啊。 HOT 7
- 是否考虑加入截屏功能 HOT 1
- Help me to config my chart! I want know the name of the vertical line which appears when a node is selected HOT 1
- InnerHTML的XSS攻击漏洞 HOT 5
- toolTip 箭头动画出现bug HOT 4
- toolTip 里 无法正常显示分秒符号(5‘34’‘) HOT 1
- 私有库导入,无法获取最新版本的代码 HOT 6
- Stored properties cannot be marked unavailable with '@available' HOT 1
- filter不起作用。使用AADataLabels().filter(AAFilter().property("percentage").operator(">").value(0.1)) HOT 3
- Can't find 'AAChartModel' file,but can find 'AAChartView' file.
- I need to apply my custom UIFont, I try to set font family via this method `.fontFamily("{my_custom_font_name}")`,but it's not working🥹🥹
- 0 line is not drawing
- 浮动提示框 `tooltip` 时间信息格式化显示
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from aachartkit-swift.