Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/477.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 是否可以在react-chart-js2中隐藏图表上显示的悬停值_Javascript_Reactjs_React Chartjs 2 - Fatal编程技术网

Javascript 是否可以在react-chart-js2中隐藏图表上显示的悬停值

Javascript 是否可以在react-chart-js2中隐藏图表上显示的悬停值,javascript,reactjs,react-chartjs-2,Javascript,Reactjs,React Chartjs 2,我已经使用react-chartjs-2库实现了一个饼图。我在显示/隐藏悬停在图表上时出现的工具提示时面临问题 import React, { PropTypes } from 'react'; import {Pie} from 'react-chartjs-2'; class PieChart extends React.Component { constructor(props, context) { super(props, context);

我已经使用react-chartjs-2库实现了一个饼图。我在显示/隐藏悬停在图表上时出现的工具提示时面临问题

import React, { PropTypes } from 'react';
import {Pie} from 'react-chartjs-2';

class PieChart extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = {
        };
}

render() {
    let color = ['#1f77b4', '#ff7f0e'];

    let cTDcolor = {
        "Being Assessed": "#4472c4",
        "Not Started": "#ed7d31",
        "No Data": "#a5a5a5"
    };

    let chartData = [], label = [], colorCTDArray = [];
    let keyAttr = this.props.keyAttribute;
    let valueAttr = this.props.valueAttribute;
    const priorityArray = ["Low","Medium","High","Pending"];
    if(this.props.chartSeries != undefined && this.props.chartSeries != null) {
        this.props.chartSeries.sort(function(a, b){
            var firstPrio = priorityArray.indexOf(a.complexity);
            var secPrio = priorityArray.indexOf(b.complexity);
            return firstPrio -secPrio 
            });
        this.props.chartSeries.map(function(element) { 
            chartData.push(element[valueAttr]);
            label.push(element[keyAttr]);
        });
    }

    //Sorting colors...
    
    label.map(function(item) {
      colorCTDArray.push(cTDcolor[item]);
    });
    const options = {
        legend: {
          labels: {
            boxWidth: 12
          }
        },
        plugins:  {
          datalabels: {
            display: false
          }  
        }
    };
  
    let data;
        data = {
            labels: label,
            datasets: [{
                data: chartData,
                backgroundColor: colorCTDArray,
                hoverBackgroundColor: colorCTDArray
            }]
        };
    return (
        <div>
                <Pie data={data} height={this.props.height} options={options} />
        </div>
        );
    }
}

PieChart.propTypes = {
    chartSeries: React.PropTypes.array,
    height: React.PropTypes.number,
    color: React.PropTypes.array,
    keyAttribute: React.PropTypes.string,
    valueAttribute: React.PropTypes.string,
    isCTD: React.PropTypes.bool,
    isPie: React.PropTypes.bool
};

export default PieChart;
import React,{PropTypes}来自'React';
从'react-chartjs-2'导入{Pie};
类PieChart扩展了React.Component{
构造函数(道具、上下文){
超级(道具、背景);
此.state={
};
}
render(){
设颜色=['#1f77b4','#ff7f0e'];
设cTDcolor={
“正在评估”:“4472c4”,
“未启动”:“ed7d31”,
“无数据”:“#a5a5a5”
};
让chartData=[]、label=[]、colorCTDArray=[];
让keyAttr=this.props.keyAttribute;
让valueAttr=this.props.valueAttribute;
常量优先级数组=[“低”、“中”、“高”、“待定”];
if(this.props.chartSeries!=未定义&&this.props.chartSeries!=空){
this.props.chartSeries.sort(函数(a,b){
var firstPrio=priorityArray.indexOf(a.complexity);
var secPrio=priorityArray.indexOf(b.complexity);
返回第一优先级-第二优先级
});
this.props.chartSeries.map(函数(元素){
chartData.push(元素[valueAttr]);
label.push(元素[keyatt]);
});
}
//排序颜色。。。
label.map(功能(项){
彩色ctdarray.push(cTDcolor[item]);
});
常量选项={
图例:{
标签:{
箱宽:12
}
},
插件:{
数据标签:{
显示:假
}  
}
};
让数据;
数据={
标签:标签,
数据集:[{
数据:图表数据,
背景颜色:ColorcDarray,
hoverBackgroundColor:colorCTDArray
}]
};
返回(
);
}
}
PieChart.propTypes={
chartSeries:React.PropTypes.array,
高度:React.PropTypes.number,
颜色:React.PropTypes.array,
keyAttribute:React.PropTypes.string,
valueAttribute:React.PropTypes.string,
isCTD:React.PropTypes.bool,
isPie:React.PropTypes.bool
};
导出默认图形;
通过从UI端传递的虚拟数据,它显示如上所示:


我不想在图表悬停时显示工具提示
无数据
。如果它可以为每个状态变量隐藏,或者只为
无数据
隐藏,就可以了。两者都能达到我的目的。我不确定,因为它可以显示/隐藏哪个对象。有人能帮我隐藏工具提示吗。

要隐藏每个状态的工具提示还是只隐藏没有数据的工具提示?可以隐藏每个状态的工具提示。