echarts自定义柱状图颜色效果代码-html代码-BFW代码库

echarts自定义柱状图颜色效果代码

代码语言：html

所属分类：图表

代码描述：echarts自定义柱状图颜色效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">
  

  
  
  
<style>
body{
  height:100%,
  
}
</style>


</head>

<body>
  <div id="chart" style="width: 90vw; height: 100vh;"></div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/echarts-4.2.1.min.js"></script>

      <script>
var chartdata = [{
  name: 'Oranges',
  type: 'bar',
  data: [20, 20, 36, 12, 15, 20] },

{
  name: 'Apples',
  type: 'bar',
  data: [8, 5, 25, 10, 10, 13] },
{
  name: 'Strawberries',
  type: 'bar',
  data: [8, 5, 20, 10, 7, 15] },

{
  name: 'Mangoes',
  type: 'bar',
  data: [8, 5, 20, 10, 7, 15] }];


var legendData = chartdata.map(function (d) {return d.name;});
var chart = document.getElementById('chart');
var myChart = echarts.init(chart);
var option = {
  title: { text: 'eCharts:Bar',
    textStyle: {
      color: '#fff' } },

.........完整代码请登录后点击上方下载按钮下载查看