eta_chart_front/src/utils/chartOptions.ts

import { IChart } from '@/types';

export const defaultOpts = {
  //图表配置
  chart: {
    spacing: [2,10,2,10],
  },
  time: {
    useUTC: false,
  },
  title: {
    text: '',
  },
  exporting: {
    enabled: false,
  },
  //默认颜色配置
  colors: [
    '#00f',
    '#f00',
    '#999',
    '#000',
    '#7cb5ec',
    '#90ed7d',
    '#f7a35c',
    '#8085e9',
    '#f15c80',
    '#e4d354',
    '#2b908f',
    '#f45b5b',
    '#91e8e1',
  ],
  //版权信息
  credits: { enabled: false },
  boost: {
    useGPUTranslations: true,
    seriesThreshold: 2
  },
  //数据列通用配置
  plotOptions: {
    series: {
      animation: false,
      turboThreshold: 0, //不限制数据点个数
      boostThreshold: 1,
      dataGrouping: {
        enabled: false,
      },//取消数据大自动数据合并
    },
    areaspline: {
			lineWidth: 1,
      stacking: 'normal',
			marker: {
					enabled: false,
			},
			// fillOpacity: 0.5,
		},
		column:{
			pointPadding: 0.05,
      stacking: 'normal',
		},
		scatter: {
			marker: {
					symbol: 'circle',
					radius: 5,
					states: {
							hover: {
									enabled: true,
							}
					}
			},
			states: {
				hover: {
					marker: {
						enabled: true
					}
				}
			},
		}
  },
  //范围选择器
  rangeSelector: {
    enabled: false,
    selected: 2,
  },
  //悬浮提示框
  tooltip: {
    split: false,
    shared: true,
    dateTimeLabelFormats: {
      // 时间格式化字符
      day: '%Y/%m/%d',
      week: '%m/%d',
      month: '%Y/%m',
      year: '%Y/%m',
    },
    xDateFormat: '%Y/%m/%d',
    // valueDecimals: 2,
  },
  //图例
  legend: {
    enabled: true,
    verticalAlign: 'top',
    margin: 5,
    // layout: 'vertical'
  },
  //滚动条
  scrollbar: {
    enabled: false,
  },
  //导航器
  navigator: {
    enabled: false,
  },
  xAxis: {
    tickPosition: 'inside',
    lineColor: '#bfbfbf',
    tickColor: '#bfbfbf',
    type: 'datetime',
    tickLength: 5,
    ordinal: false,
    dateTimeLabelFormats: {
      day: '%y/%m',
      week: '%y/%m',
      month: '%y/%m',
      year: '%y/%m',
    },
  },
  //默认y轴配置 用于季节图
  yAxis: {
    lineWidth: 1,
    lineColor: '#bfbfbf',
    tickColor: '#bfbfbf',
    offset: 0,
    opposite: false,
    reversed: false,
    visible: true,
    gridLineWidth: 0,
    tickWidth: 1,
    tickLength: 5,
    tickPosition: 'inside',
    endOnTick: false,
    startOnTick: false,
    showLastLabel: true,
  },
};

/* 季节性图配置 */
export const seasonOptions = {
  //默认颜色配置
  colors: [
    '#4B0082',
    '#7FFFAA',
    '#FF4500',
    '#808000',
    '#EEE8AA',
    '#849EC1',
    '#8A4294',
    '#578B5A',
    '#FDA8C7',
    '#53B3FF',
    '#999999',
    '#000000',
    '#FFDF0C',
    '#FF0000',
    '#0033FF',
  ],
};