> import Taro, {Component} from '@tarojs/taro' import {View, Text,
> Image} from '@tarojs/components' import * as echarts from
> "@assets/js/ec-canvas/echarts" import PropTypes from 'prop-types'
> import request from '@service/request' import styles from
> './index.module.scss'
>
>
>
> //直播监控 class index extends Component { static propTypes ={
> canvasId: PropTypes.string } static defaultProps = {
> canvasId:'' } config = {
> usingComponents: {
> "ec-canvas": "../../../../../assets/js/ec-canvas/ec-canvas"
> } } static config = {
> navigationBarTitleText: '视频监控-报告',
> usingComponents: {
> "ec-canvas": "../../../../../assets/js/ec-canvas/ec-canvas"
> } }
>
> constructor(props) {
> super(props)
> this.state = {
> ec: {
> }
> } }
>
>
> componentDidMount() {
> this.Chart.init(this.initChart); }
>
> componentWillReceiveProps(nextProps) {
> console.log(this.props, nextProps) }
>
> componentDidShow() { }
>
> componentDidHide() { } initChart = (canvas, width, height, dpr)
> => {
> // return
> const chart = echarts.init(canvas, null, {
> width: width,
> height: height,
> devicePixelRatio: dpr // new
> });
>
> canvas.setChart(chart);
> let option = {
> title: {
> text: '测试下面legend的红色区域不应被裁剪',
> left: 'center'
> },
> color: ["#37A2DA", "#67E0E3", "#9FE6B8"],
> legend: {
> data: ['A', 'B', 'C'],
> top: 50,
> left: 'center',
> backgroundColor: 'red',
> z: 100
> },
> grid: {
> containLabel: true
> },
> tooltip: {
> show: true,
> trigger: 'axis'
> },
> xAxis: {
> type: 'category',
> boundaryGap: false,
> data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
> // show: false
> },
> yAxis: {
> x: 'center',
> type: 'value',
> splitLine: {
> lineStyle: {
> type: 'dashed'
> }
> }
> // show: false
> },
> series: [{
> name: 'A',
> type: 'line',
> smooth: true,
> data: [18, 36, 65, 30, 78, 40, 33]
> }, {
> name: 'B',
> type: 'line',
> smooth: true,
> data: [12, 50, 51, 35, 70, 30, 20]
> }, {
> name: 'C',
> type: 'line',
> smooth: true,
> data: [10, 30, 31, 50, 40, 20, 10]
> }]
> }
> chart.setOption(option);
> return chart; }
>
> refresh(data, type) {
> this.Chart.init((canvas, width, height) => {
> const chart = echarts.init(canvas, null, {
> width: width,
> height: height
> });
> this.initChart(chart, data, type);
> return chart;
> }); } refChart = node => (this.Chart = node); render() {
> let {canvasId}=this.props
> let {ec}=this.state
> return (
> canvasId={canvasId}
> className={[styles.area,'charts']}
> ref={this.refChart}
> ec={ec}
> />
> 22
>
> ) } }
>
> export default index
