chart实现动态柱状图上下起伏动画效果代码-html代码-BFW代码库

chart实现动态柱状图上下起伏动画效果代码

代码语言：html

所属分类：图表

代码描述：chart实现动态柱状图上下起伏动画效果代码

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

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">


</head>
<body>
<!-- partial:index.partial.html -->
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/chart.js"></script>
<canvas id="chart"></canvas>
<button id="update-chart">Update Chart</button>
<!-- partial -->
  <script  >
      const chartCanvas = document.getElementById('chart');
const ctx = chartCanvas.getContext('2d');

const data = {
  labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
  datasets: [
    {
      label: 'Dataset 1',
      data: [12, 19, 3, 5, 2, 3],
      backgroundColor: ['rgba(255, 99, 132, 0.2)', 'rgba(54, 162, 235, 0.2)', 'rgba(255, 206, 86, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(153, 102, 255, 0.2)', 'rgba(255, 159, 64, 0.2)'],
      borderColor: ['.........完整代码请登录后点击上方下载按钮下载查看