zoukankan      html  css  js  c++  java
  • highcharts图表的图例legend

    一、将图例Legend放于图表右侧
    1、设置chart的marginRight属性值:
    chart: {
      marginRight: 120
    }
    2、设置legend图例属性值如下

    legend: {
      align: ""right"", //程度标的目标地位
      verticalAlign: ""top"", //垂直标的目标地位
      x: 0, //间隔x轴的间隔
      y: 100 //间隔Y轴的间隔
    }

    3、结果图:

    二、将图例放于图表左上角
    1、设置legend的属性
    legend: {
      align: ""left"", //程度标的目标地位
      verticalAlign: ""top"", //垂直标的目标地位
      x: 0, //间隔x轴的间隔
      y: 0 //间隔Y轴的间隔
    }

    2、结果图:

    三、将图例放于图表上方中心
    1、设置legend属性如下
    legend: {
      align: ""center"", //程度标的目标地位
      verticalAlign: ""top"", //垂直标的目标地位
      x: 0, //间隔x轴的间隔
      y: 20 //间隔Y轴的间隔
    }
    2、结果图如下:

    四、将图例放于下方中心
    1、设置legend属性如下
    legend: {
      align: ""center"", //程度标的目标地位
      verticalAlign: ""bottom"", //垂直标的目标地位
      x: 0, //间隔x轴的间隔
      y: 0 //间隔Y轴的间隔
    },
    2、结果图如下:

  • 相关阅读:
    redis 学习(一)
    spring 学习总结(一)
    Struts2 学习(三)
    Python3 高级特性
    Python3 模块
    Python3 函数式编程
    Python3 函数
    Python3 列表
    Python3 字符编码
    Java Servlet 回顾
  • 原文地址:https://www.cnblogs.com/linn/p/3920068.html
Copyright © 2011-2022 走看看