apexcharts实现深色曲线走势流量图图表效果代码-html代码-BFW代码库

apexcharts实现深色曲线走势流量图图表效果代码

代码语言：html

所属分类：图表

代码描述：apexcharts实现深色曲线走势流量图图表效果代码

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

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/apexcharts.js"></script>
    <style>
        body {
	background:#000524;
}
#wrapper {
	padding-top:20px;
	background:#000524;
	border:1px solid #000;
	box-shadow:0 22px 35px -16px rgba(0,0,0,0.71);
	max-width:650px;
	margin:35px auto;
}
#chart-bar {
	position:relative;
	margin-top:-38px;
}

    </style>
</head>

<body>

    <div id="wrapper">
        <div id="chart-area"></div>
        <div id="chart-bar"></div>
    </div>
    <script>
        var data = generateDayWiseTimeSeries(new Date("22 Apr 2017").getTime(), 115, {
      min: 30,
      max: 90
  });
  var options1 = {
      chart: {
          id: "chart2",
          type: "area",
          height: 230,
          foreColor: "#ccc",
          toolbar: {
              autoSelected: "pan",
              show: false
          }
      },
      colors: ["#00BAEC"],
      stroke: {
          width: 3
      },
      grid: {
          borderColor: "#555",
          yaxis: {
              lines: {
                  show: false
              }
          }
      },
      dataLabels: {
          enabled: false
      },
      fill: {
          gradient: {
              enabled: true,
              opacityFrom: 0.55,
              opacityTo: 0
          }
      },
      markers: {
          size: 5,
          colors: ["#000524"],
          strokeColor: "#00BAEC",
          strokeWidth: 3
      },
      series: [{
          data: data
      }],
      tooltip: {
          theme: &.........完整代码请登录后点击上方下载按钮下载查看