Echarts可视化教程

  1. 网站首页
  2. 百度ECharts
  3. ECharts实例
  4. ECharts入门
  5. 地图大全
  6. ECharts官网

如何利用Highcharts语法插入漂亮的图表

Highcharts 是一款开源的 JavaScript 图表库,它能够为网站添加精美的图表。通过简洁的 API,Highcharts 支持多种类型的图表,包括折线图、柱状图、饼图和散点图等。下面的代码是一个走势图,具体效果图如右图~

具体实现代码如下:

<!DOCTYPE html>
<html>
<head>
  <title>如何利用Highcharts语法插入漂亮的图表o</title>
  <script src="https://code.highcharts.com/highcharts.js"></script>
  <script src="https://code.highcharts.com/modules/exporting.js"></script>
  <script src="https://code.highcharts.com/modules/accessibility.js"></script>
</head>
<body>
  <div id="chart-container" style="width:600px;"></div>
  <script>
    var data = [1, 3, 2, 4, 5]; // 数据数组
	var options = { // 配置选项
	  chart: {
		type: 'line' // 图表类型为折线图
	  },
	  series: [{
		data: data // 数据
	  }]
	};
	 
	// 在 #chart-container 容器中绘制图表
	Highcharts.chart('chart-container', options);
  </script>
</body>
</html>
点击展开全文

相关文章

  1. 如何利用Highcharts中使用烛台图来展示数据
  2. 如何利用Highcharts中使用盒须图来展示数据
  3. 如何利用Highcharts创建温度计图表
  4. 如何利用Highcharts创建一个雷达图表