@castianta/chart-lc/es/demo/lineRender.js

lc版图表

import _Tooltip from "antd/es/tooltip";
import React from 'react';
import { Line } from '../index';
import { CodeSandboxOutlined } from '@ant-design/icons';
import dataList from './data';
import moment from 'moment';

var data = function data() {
  var value = [];

  for (var i = 0; i < 90; i++) {
    value.push({
      x: i,
      y: Math.random()
    });
  }

  return value;
};

export default (function () {
  return /*#__PURE__*/React.createElement(Line, {
    card: {
      title: /*#__PURE__*/React.createElement(_Tooltip, {
        title: "\u5728 CodeSandbox \u4E2D\u6253\u5F00"
      }, /*#__PURE__*/React.createElement(CodeSandboxOutlined, {
        onClick: function onClick() {
          return window.open('https://codesandbox.io/s/o0wvl');
        }
      }))
    },
    legend: {
      show: true
    },
    dataSource: [{
      name: '线条1',
      color: '#029',
      data: dataList.filter(function (_ref) {
        var name = _ref.name;
        return name === 'rd';
      }).map(function (_ref2) {
        var time = _ref2.time,
            value = _ref2.value;
        return {
          x: moment(time).valueOf() - moment(new Date(2021, 1, 1)).valueOf(),
          y: value
        };
      }),
      cursorEnabled: true
    }, {
      name: '线条2',
      color: '#946',
      data: dataList.filter(function (_ref3) {
        var name = _ref3.name;
        return name === 'sa';
      }).map(function (_ref4) {
        var time = _ref4.time,
            value = _ref4.value;
        return {
          x: moment(time).valueOf() - moment(new Date(2021, 1, 1)).valueOf(),
          y: value
        };
      }),
      cursorEnabled: true
    }],
    xAxis: {
      tickStrategy: 'DateTime',
      scrollStrategy: 'fitting',
      tickStrategyStyler: function tickStrategyStyler(tickStrategy) {
        return tickStrategy.setDateOrigin(new Date(2021, 1, 1));
      }
    },
    chartRender: function chartRender(chart, _ref5, dataSource) {
      var setSeries = _ref5.setSeries,
          setAxis = _ref5.setAxis;
      var x = chart.getDefaultAxisX();
      var defX = setAxis(x, {
        title: '默认x轴',
        titleColor: 'red'
      });
      var defY = chart.getDefaultAxisY();
      var OTTaskSchedule = [{
        dataTransferScheduleStart: '2021-04-09 18:10:00',
        dataTransferScheduleEnd: '2021-04-09 18:15:00'
      }]; //新增侦查数传区间

      OTTaskSchedule === null || OTTaskSchedule === void 0 ? void 0 : OTTaskSchedule.map(function (item, i) {
        x.addBand().setValueStart(moment(item === null || item === void 0 ? void 0 : item.dataTransferScheduleStart).valueOf() - moment(new Date(2021, 1, 1)).valueOf()).setValueEnd(moment(item === null || item === void 0 ? void 0 : item.dataTransferScheduleEnd).valueOf() - moment(new Date(2021, 1, 1)).valueOf()) // Set the name of the Band
        .setName("\u7B2C" + (i + 1) + "\u6B21\u4FA6\u67E5\u6570\u4F20").setMouseInteractions(false);
      });
      var axisY = chart.addAxisY({
        opposite: true
      });
      dataSource.forEach(function (list, index) {
        setSeries({
          series: chart.addLineSeries({
            xAxis: defX,
            yAxis: index === 0 ? defY : axisY
          }),
          list: list,
          index: index
        });
      });
    }
  });
});