HighCharts 直方图与散点图多轴绘制,多轴不同步修改刻度+柱状图柱子高亮显示
  Pv0IpoDO5CJz 2023年12月06日 24 0

需求:直方图与散点图绘制并可选择柱子,柱状图某一列柱子的高亮显示

分析:绘制直方图需要引入histogram-bellcurve.js文件,并设置图表类型为histogram(直方图),散点图只需设置图表类型为scatter即可实现,多轴不同步进行修改刻度在轴属性里用alignTicks(同步修改轴刻度)进行设置

解决:

源代码:

HighCharts 直方图与散点图多轴绘制,多轴不同步修改刻度+柱状图柱子高亮显示_高亮显示

HighCharts 直方图与散点图多轴绘制,多轴不同步修改刻度+柱状图柱子高亮显示_高亮显示_02


示例

HighCharts 直方图与散点图多轴绘制,多轴不同步修改刻度+柱状图柱子高亮显示_直方图_03

需要注意的是,上述示例只是一个简单的示范,实际使用时需要根据具体的数据和需求进行适当的调整和扩展。

Highcharts提供了丰富的配置选项,也可以参考Highcharts官方文档来了解更多细节和API用法。

希望这些信息对大家有所帮助!如果您有任何其他问题,请随时提问。

直方图与散点图图表一起绘制以上表为例进行总结:

直方图与散点图多轴绘制

  1. 导入histogram-bellcurve.js文件
  2. xAxis/yAxis写两组轴并开启(opposite)相反一侧属性
  3. 在系列(series)写两组数据列
  4. 在数据列中用(xAxis/yAxis:)指定相关轴并指定直方图散点图图表属性
  5. 接着使用allowPointSelect(选择点)属性使图表可选择
【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年12月06日 0

暂无评论

推荐阅读
Pv0IpoDO5CJz