You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by wa...@apache.org on 2020/10/23 09:28:42 UTC

[incubator-echarts-examples] branch next updated: add gauge-temperature chart example

This is an automated email from the ASF dual-hosted git repository.

wangdd pushed a commit to branch next
in repository https://gitbox.apache.org/repos/asf/incubator-echarts-examples.git


The following commit(s) were added to refs/heads/next by this push:
     new b634479  add gauge-temperature chart example
b634479 is described below

commit b634479b393eeae21199b714ee32aaf803d07801
Author: Wdingding <wa...@gmail.com>
AuthorDate: Fri Oct 23 17:28:29 2020 +0800

    add gauge-temperature chart example
---
 public/data/gauge-temperature.js | 122 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 122 insertions(+)

diff --git a/public/data/gauge-temperature.js b/public/data/gauge-temperature.js
new file mode 100644
index 0000000..a599519
--- /dev/null
+++ b/public/data/gauge-temperature.js
@@ -0,0 +1,122 @@
+/*
+title: Temperature Gauge chart
+titleCN: 气温仪表盘
+category: gauge
+difficulty: 4
+*/
+
+option = {
+    series: [{
+            type: 'gauge',
+            center: ["50%", "60%"],
+            startAngle: 200,
+            endAngle: -20,
+            min: 0,
+            max: 60,
+            splitNumber: 12,
+            itemStyle: {
+                color: '#FFAB91'
+            },
+            progress: {
+                show: true,
+                width: 30
+            },
+
+            pointer: {
+                show: false,
+            },
+            axisLine: {
+                lineStyle: {
+                    width: 30
+                }
+            },
+            axisTick: {
+                distance: -45,
+                splitNumber: 5,
+                lineStyle: {
+                    width: 2,
+                    color: '#999'
+                }
+            },
+            splitLine: {
+                distance: -52,
+                length: 14,
+                lineStyle: {
+                    width: 3,
+                    color: '#999'
+                }
+            },
+            axisLabel: {
+                distance: -20,
+                color: '#999',
+                fontSize: 20
+            },
+            anchor: {
+                show: false
+            },
+            title: {
+                show: false
+            },
+            detail: {
+                width: '60%',
+                lineHeight: 40,
+                height: '15%',
+                borderRadius: 8,
+                offsetCenter: [0, '-15%'],
+                fontSize: 60,
+                fontWeight: 'bolder',
+                formatter: '{value} °C',
+                color: 'auto'
+            },
+            data: [{
+                value: 20
+            }]
+        },
+
+        {
+            type: 'gauge',
+            center: ["50%", "60%"],
+            startAngle: 200,
+            endAngle: -20,
+            min: 0,
+            max: 60,
+            itemStyle: {
+                color: '#FD7347',
+            },
+            progress: {
+                show: true,
+                width: 8
+            },
+
+            pointer: {
+                show: false
+            },
+            axisLine: {
+                show: false
+            },
+            axisTick: {
+                show: false
+            },
+            splitLine: {
+                show: false
+            },
+            axisLabel: {
+                show: false
+            },
+            detail: {
+                show: false
+            },
+            data: [{
+                value: 20,
+            }]
+
+        }
+    ],
+};
+
+setInterval(function() {
+    let random = (Math.random() * 60).toFixed(2) - 0;
+    option.series[0].data[0].value = random;
+    option.series[1].data[0].value = random;
+    myChart.setOption(option, true);
+}, 2000);
\ No newline at end of file


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org