| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262 |
- export const gaugeConfig = {
- /**
- * @description Whether to display this gauge
- * @type {Boolean}
- * @default show = true
- */
- show: true,
- /**
- * @description Legend name
- * @type {String}
- * @default name = ''
- */
- name: '',
- /**
- * @description Radius of gauge
- * @type {String|Number}
- * @default radius = '60%'
- * @example radius = '60%' | 100
- */
- radius: '60%',
- /**
- * @description Center point of gauge
- * @type {Array}
- * @default center = ['50%','50%']
- * @example center = ['50%','50%'] | [100, 100]
- */
- center: ['50%', '50%'],
- /**
- * @description Gauge start angle
- * @type {Number}
- * @default startAngle = -(Math.PI / 4) * 5
- * @example startAngle = -Math.PI
- */
- startAngle: -(Math.PI / 4) * 5,
- /**
- * @description Gauge end angle
- * @type {Number}
- * @default endAngle = Math.PI / 4
- * @example endAngle = 0
- */
- endAngle: Math.PI / 4,
- /**
- * @description Gauge min value
- * @type {Number}
- * @default min = 0
- */
- min: 0,
- /**
- * @description Gauge max value
- * @type {Number}
- * @default max = 100
- */
- max: 100,
- /**
- * @description Gauge split number
- * @type {Number}
- * @default splitNum = 5
- */
- splitNum: 5,
- /**
- * @description Gauge arc line width
- * @type {Number}
- * @default arcLineWidth = 15
- */
- arcLineWidth: 15,
- /**
- * @description Gauge chart data
- * @type {Array}
- * @default data = []
- */
- data: [],
- /**
- * @description Data item arc default style configuration
- * @type {Object}
- * @default dataItemStyle = {Configuration Of Class Style}
- */
- dataItemStyle: {
- },
- /**
- * @description Axis tick configuration
- * @type {Object}
- */
- axisTick: {
- /**
- * @description Whether to display axis tick
- * @type {Boolean}
- * @default show = true
- */
- show: true,
- /**
- * @description Axis tick length
- * @type {Number}
- * @default tickLength = 6
- */
- tickLength: 6,
- /**
- * @description Axis tick default style configuration
- * @type {Object}
- * @default style = {Configuration Of Class Style}
- */
- style: {
- stroke: '#999',
- lineWidth: 1
- }
- },
- /**
- * @description Axis label configuration
- * @type {Object}
- */
- axisLabel: {
- /**
- * @description Whether to display axis label
- * @type {Boolean}
- * @default show = true
- */
- show: true,
- /**
- * @description Axis label data (Can be calculated automatically)
- * @type {Array}
- * @default data = [Number...]
- */
- data: [],
- /**
- * @description Axis label formatter
- * @type {String|Function}
- * @default formatter = null
- * @example formatter = '{value}%'
- * @example formatter = (labelItem) => (labelItem.value)
- */
- formatter: null,
- /**
- * @description Axis label gap between label and axis tick
- * @type {String|Function}
- * @default labelGap = 5
- */
- labelGap: 5,
- /**
- * @description Axis label default style configuration
- * @type {Object}
- * @default style = {Configuration Of Class Style}
- */
- style: {}
- },
- /**
- * @description Gauge pointer configuration
- * @type {Object}
- */
- pointer: {
- /**
- * @description Whether to display pointer
- * @type {Boolean}
- * @default show = true
- */
- show: true,
- /**
- * @description Pointer value index of data
- * @type {Number}
- * @default valueIndex = 0 (pointer.value = data[0].value)
- */
- valueIndex: 0,
- /**
- * @description Pointer default style configuration
- * @type {Object}
- * @default style = {Configuration Of Class Style}
- */
- style: {
- scale: [1, 1],
- fill: '#fb7293'
- }
- },
- /**
- * @description Data item arc detail configuration
- * @type {Object}
- */
- details: {
- /**
- * @description Whether to display details
- * @type {Boolean}
- * @default show = false
- */
- show: false,
- /**
- * @description Details formatter
- * @type {String|Function}
- * @default formatter = null
- * @example formatter = '{value}%'
- * @example formatter = '{name}%'
- * @example formatter = (dataItem) => (dataItem.value)
- */
- formatter: null,
- /**
- * @description Details position offset
- * @type {Array}
- * @default offset = [0, 0]
- * @example offset = [10, 10]
- */
- offset: [0, 0],
- /**
- * @description Value fractional precision
- * @type {Number}
- * @default valueToFixed = 0
- */
- valueToFixed: 0,
- /**
- * @description Details position
- * @type {String}
- * @default position = 'center'
- * @example position = 'start' | 'center' | 'end'
- */
- position: 'center',
- /**
- * @description Details default style configuration
- * @type {Object}
- * @default style = {Configuration Of Class Style}
- */
- style: {
- fontSize: 20,
- fontWeight: 'bold',
- textAlign: 'center',
- textBaseline: 'middle'
- }
- },
- /**
- * @description Gauge background arc configuration
- * @type {Object}
- */
- backgroundArc: {
- /**
- * @description Whether to display background arc
- * @type {Boolean}
- * @default show = true
- */
- show: true,
- /**
- * @description Background arc default style configuration
- * @type {Object}
- * @default style = {Configuration Of Class Style}
- */
- style: {
- stroke: '#e0e0e0'
- }
- },
- /**
- * @description Gauge chart render level
- * Priority rendering high level
- * @type {Number}
- * @default rLevel = 10
- */
- rLevel: 10,
- /**
- * @description Gauge animation curve
- * @type {String}
- * @default animationCurve = 'easeOutCubic'
- */
- animationCurve: 'easeOutCubic',
- /**
- * @description Gauge animation frame
- * @type {Number}
- * @default animationFrame = 50
- */
- animationFrame: 50,
- }
|