Panduan amali ECharts dan golang: membuat pelbagai jenis carta statistik

Panduan amalan carta dan golang: Membuat pelbagai jenis carta statistik

Dengan kemunculan era digital, nilai data menjadi semakin penting. Walau bagaimanapun, nilai data hanya wujud dalam analisis dan penggunaannya. Untuk menganalisis data dengan lebih baik, carta adalah salah satu alat penting. Dalam artikel ini, kami akan memperkenalkan cara menggunakan ECharts dan golang, dua alat terkenal, untuk mencipta pelbagai jenis carta statistik.

Persediaan

Pertama, kita perlu menyediakan persekitaran ECharts dan golang.

ECharts ialah perpustakaan visualisasi data sumber terbuka berasaskan JavaScript dengan interaktiviti yang baik dan kesan dinamik, menyokong pelbagai jenis carta. Kami boleh memasang ECharts dalam dua cara berikut:

1. Muat turun terus fail echarts.js dan perkenalkan dalam HTML
2. Guna npm untuk memasang

Di sini kita pilih cara pertama, selepas memuat turun, dalam fail HTML Hanya perkenalkan :

<script src="/path/echarts.min.js"></script>

golang ialah bahasa yang ditaip secara statik, disusun yang menekankan keselarasan dan kecekapan serta digunakan secara meluas dalam pembangunan bahagian belakang. Kita perlu memasang persekitaran golang, yang boleh dipasang dengan memuat turun pakej pemasangan yang sepadan dari laman web rasmi.

Buat carta bar

Carta bar ialah jenis carta biasa yang menunjukkan perbezaan dalam data. Berikut menerangkan cara menggunakan ECharts dan golang untuk melaksanakan histogram.

Pertama, kita perlu menyediakan data yang diperlukan. Contohnya, dalam golang:

data := []int{120, 200, 150, 80, 70, 110, 130}

Kemudian, kita perlu mentakrifkan contoh ECharts dan menetapkan sifat asas carta. Contohnya:

var chart = echarts.init(document.getElementById('chart'));

var option = {
  title: {
    text: '柱状图'
  },
  tooltip: {},
  xAxis: {
    data: ['A', 'B', 'C', 'D', 'E', 'F', 'G']
  },
  yAxis: {},
  series: [{
    name: '数据',
    type: 'bar',
    data: data
  }]
};

chart.setOption(option);

Dalam kod, kami mentakrifkan tika ECharts dan menentukan id carta, dan kemudian menentukan sifat asas carta, termasuk tajuk, paksi X/Y dan siri data. Akhir sekali, kami menetapkan sifat ini kepada carta melalui kaedah setOption.

Buat Carta Garisan

Carta garis ialah jenis carta yang menunjukkan arah aliran data. Berikut menerangkan cara menggunakan ECharts dan golang untuk melaksanakan carta garis.

Pertama, kita perlu menyediakan data yang diperlukan. Contohnya, dalam golang:

xData := []string{"2010", "2011", "2012", "2013", "2014", "2015", "2016"}
yData := []int{120, 200, 150, 80, 70, 110, 130}

Kemudian, kita perlu mentakrifkan contoh ECharts dan menetapkan sifat asas carta. Contohnya:

var chart = echarts.init(document.getElementById('chart'));

var option = {
  title: {
    text: '折线图'
  },
  tooltip: {},
  xAxis: {
    data: xData
  },
  yAxis: {},
  series: [{
    name: '数据',
    type: 'line',
    data: yData
  }]
};

chart.setOption(option);

Dalam kod, kami mentakrifkan tika ECharts dan menentukan id carta, dan kemudian menentukan sifat asas carta, termasuk tajuk, paksi X/Y dan siri data. Perbezaannya ialah di sini kita menetapkan jenis siri data kepada baris, iaitu jenis polyline.

Buat carta pai

Carta pai ialah sejenis carta yang memaparkan perkadaran data. Berikut menerangkan cara menggunakan ECharts dan golang untuk melaksanakan carta pai.

Pertama, kita perlu menyediakan data yang diperlukan. Contohnya, dalam golang:

data := []struct {
  Value float64 `json:"value"`
  Name  string  `json:"name"`
}{
  {Value: 335, Name: "A"},
  {Value: 310, Name: "B"},
  {Value: 234, Name: "C"},
  {Value: 135, Name: "D"},
  {Value: 1548, Name: "E"}
}

Kemudian, kita perlu mentakrifkan contoh ECharts dan menetapkan sifat asas carta. Contohnya:

var chart = echarts.init(document.getElementById('chart'));

var option = {
  title: {
    text: '饼图'
  },
  tooltip: {},
  series: [{
    name: '数据',
    type: 'pie',
    radius: '50%',
    data: data,
    roseType: 'angle'
  }]
};

chart.setOption(option);

Dalam kod, kami mentakrifkan tika ECharts dan menentukan id carta, dan kemudian menentukan sifat asas carta, termasuk tajuk dan siri data. Perbezaannya ialah di sini kami menetapkan jenis siri data kepada pai, iaitu jenis carta pai, dan menetapkan sifat carta pai lain, seperti jejari dan roseType.

Ringkasnya, kami memperkenalkan cara menggunakan ECharts dan golang untuk mencipta carta bar, carta garis dan carta pai, dan memberikan contoh kod khusus. Sudah tentu, ini hanyalah puncak gunung es ECharts dan golang Kedua-dua alat mempunyai senario dan fungsi penggunaan yang sangat kaya. Pembaca boleh terus belajar dan meneroka secara mendalam.

Atas ialah kandungan terperinci Panduan amali ECharts dan golang: membuat pelbagai jenis carta statistik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!