{{target: series-gauge}}
Gauge chart
**Example: ** ~600x500
{{use: partial-component-id(prefix=“#”)}}
{{ use: partial-series-name() }}
{{ use: partial-circular-layout }}
The radius of gauge chart. It can be a percentage value of the smaller of container half width and half height, also can be an absolute value.
{{ use partial-legend-hover-link }}
The start angle of gauge chart. The direct right side of circle center is 0
degree, the right above it is 90
degree, the direct left side of it is 180
degree.
The end angle of gauge chart.
Whether the scale in gauge chart increases clockwise.
{{ use: partial-1d-data-desc }}
Data name.
Data value.
The minimum data value which map to minAngle.
The maximum data value which map to maxAngle.
The number of split segments of gauge chart scale.
The related configuration about the axis line of gauge chart.
Whether to show the axis line of gauge chart.
The style of the axis line of gauge chart.
The axis line of gauge chart can be divided to several segments in different colors. The end position and color of each segment can be expressed by an array.
Default value:
[[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']]
The width of axis line. {{ use: partial-style-shadow-opacity(prefix=“###”) }}
The style of split line.
Whether to show the split line.
The length of split line, can be a pecentage value relative to radius.
{{ use: partial-line-style( prefix=‘###’, defaultColor=‘#eee’, defaultWidth=2, defaultType=“‘solid’” ) }}
The tick line style.
Whether to show the scale.
The split scale number between split line.
The length of tick line, can be a pecentage value relative to radius.
{{ use: partial-line-style( prefix=‘###’, defaultColor=‘#eee’, defaultWidth=1, defaultType=“‘solid’” ) }}
Axis tick label.
Whether to show the label.
The content formatter of scale label, which supports both string template and callback function. Example:
// use string template. the template variable {value} represent the default label text formatter: '{value} kg' // use function callback. the function parameters are scale values. formatter: function (value) { return value + 'km/h'; }
{{ use: partial-text-style( prefix=“##”, noAlign=true, noVerticalAlign=true ) }}
Gauge chart pointer.
Whether to show the pointer.
The length of pointer which could be absolute value and also the percentage relative to radius.
The width of pointer.
The style of gauge chart. {{ use: partial-item-style(prefix=“##”) }}
The color of pointer. Defaults to use the color of section where the numerical value belongs to.
{{ use: partial-item-style(prefix=“###”) }}
The title of gauge chart.
Whether to show the title.
The offset position relative to the center of gauge chart. The first item of array is the horizontal offset; the second item of array is the vertical offset. It could be absolute value and also the percentage relative to the radius of gauge chart. {{ use: partial-text-style( prefix=“##”, defaultColor = “‘#333’”, defaultFontSize = 15, noAlign=true, noVerticalAlign=true ) }}
The detail about gauge chart which is used to show data.
Whether to show the details.
The width of detail.
The height of detail.
The background color of detail.
The border width of detail.
Formatter is used to format detail, which supports string template and callback function.
formatter: function (value) { return value.toFixed(0); }
The border color of detail.
The offset position relative to the center of gauge chart. The first item of array is the horizontal offset; the second item of array is the vertical offset. It could be absolute value and also the percentage relative to the radius of gauge chart. {{ use: partial-text-style( prefix=“##”, defaultColor = “‘auto’”, defaultFontSize = 15, noAlign=true, noVerticalAlign=true ) }}
The text color. Defaults to use the color of section where the numerical value belongs to.
{{use: partial-marker( prefix=“#”, galleryEditorPath=${galleryEditorPath}, seriesType=“gauge” )}}
{{use:partial-animation(prefix=“#”)}}
{{use: partial-tooltip-in-series( galleryViewPath=${galleryViewPath} )}}