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、结果图如下:

  • 相关阅读:
    HTML DOM 事件
    js实现键盘数字输入
    js实现键盘数字输入
    onbeforeunload事件兼容性操作
    onbeforeunload事件兼容性操作
    window.event对象详尽解析
    git简单使用教程
    PHP中奖概率写法
    PHP替代session的方法
    nginx实现负载均衡
  • 原文地址:https://www.cnblogs.com/linn/p/3920068.html
Copyright © 2011-2022 走看看