最近的一个需求,做出来之后觉得很简单的一个操作,分享出来
需求是这样的:echarts的柱状图,点击可以选中变色,最多可以选中五个柱子,五个柱子五个颜色,不能重复。
先看个效果:
然后上代码:
import React, {
Component } from 'react';
import * as echarts from 'echarts';
import ReactEcharts from 'echarts-for-react';
import styles from '../details.less';
import _ from 'lodash'
const colorLists = {
"0" : "#6bd6fc",
"1": "#3beaab",
"2": "#fd9087",
"3": "#adc6ff",
"4": "#fed856",
}
let unused = [1];
let initialCid = [0,1,2,3,4]
class Bar extends Component {
render() {
const textColor = "#464c5b";
const axisColor = "#657180";
const handleChartClick = params => {
const platform = params.data;
const quota = this.props.articleDetails[showType];
const {
show } = this.props.articleDetails;
if (show[showType]) {
const {
current } = quota;
let existed = false;
for (let i = 0; i < current