面积图

Posted 2021-01-16 liuyinlei

1.面积图

var chart = null;
Highcharts.setOptions({ 
  colors: [‘#f37938‘] 
}); 
$.getJSON(‘https://data.jianshukeji.com/jsonp?filename=json/usdeur.json&callback=?‘, function (data) {
  chart = Highcharts.chart(‘container‘, {
    chart: {
      type:‘area‘
    },
    title: {
      text: ‘‘
    },
    credits: {
      enabled: false
    },
    xAxis: {
      tickWidth:0,
      tickInterval: 20,
      // type:‘datetime‘,
      // categories:[‘2018-01-11‘,‘2018-01-22‘],
      formatter:function(){
        console.log(this.point);
        return this.point;
      }
    },
    tooltip: {
      enabled: false
    },
    yAxis: {
      title: {
        text: ‘‘
      }
    },
    legend: {
      enabled: false
    },
    plotOptions: {
      area: {
        fillColor: {
          linearGradient: {
            x1: 0,
            y1: 0,
            x2: 0,
            y2: 1
          },
          stops: [
            [0, ‘rgb(255, 168, 0)‘],
            [1, ‘rgb(255, 255, 255)‘]
          ]
        },
        lineWidth: 1,
        states: {
          hover: {
            lineWidth: 1
          }
        },
        areaspline: {
          color:‘#rgba(255, 168, 0,0.2)‘,
          lineColor:‘#ffba00‘,
          fillOpacity: 1
        },
        threshold: null
      },
      series: {
        marker: {
          states: {
            hover: {
              enabled: false
            }
          }
        }
      }
    },
    series: [{
      marker: {
        radius:0,
        lineWidth:0,
        lineColor:‘#f37938‘,
        fillColor:‘#f37938‘,
      },
      data:[‘2018-01-02‘,‘2018-01-03‘, ‘2018-01-04‘,‘2018-01-05‘, ‘2018-01-06‘,‘2018-01-07‘, 
      ‘2018-01-08‘,‘2018-01-09‘, ‘2018-01-10‘,‘2018-01-11‘,2018-01-12‘,‘2018-01-13‘, ‘2018-01-14‘,‘2018-01-15‘,
      ‘2018-01-16‘,‘2018-01-17‘, ‘2018-01-18‘,‘2018-01-19‘,2018-01-20‘,‘2018-01-21‘,
      ‘2018-01-22‘,‘2018-01-23‘, ‘2018-01-24‘,‘2018-01-25‘]
        [‘2018-01-02‘,6.7],
        [‘2018-01-03‘,6.8],
        [‘2018-01-04‘,6.9],
        [‘2018-01-05‘,6.91],
        [‘2018-01-06‘,6.92],
        [‘2018-01-07‘,6.95],
        [‘2018-01-08‘,7.0],
        [‘2018-01-09‘,7.1],
        [‘2018-01-10‘,7.2],
        [‘2018-01-11‘,7.3],
        [‘2018-01-12‘,7.4],
        [‘2018-01-13‘,7.5],
        [‘2018-01-14‘,7.7],
        [‘2018-01-15‘,7.8],
        [‘2018-01-16‘,7.9],
        [‘2018-01-17‘,8.01],
        [‘2018-01-18‘,8.2],
        [‘2018-01-19‘,8.3],
        [‘2018-01-20‘,8.5],
        [‘2018-01-21‘,8.51],
        [‘2018-01-22‘,8.52],
        [‘2018-01-23‘,8.34],
        [‘2018-01-24‘,8.4],
        [‘2018-01-25‘,8.5]
      ]
    }]
  });
});