小编gre*_*uka的帖子

饼图中的Chart.js ng2-charts颜色未显示

我正在使用 ng-2 图表,虽然我可以正确显示饼图,但我无法更改不同饼图切片的颜色。

似乎存在一个错误,即饼图的所有切片都获得了对象中声明的第一种颜色(在本例中为红色)。

我的 component.ts 看起来像:

public pieChartColors:Array<any> = [
  {
    backgroundColor: 'red',
    borderColor: 'rgba(135,206,250,1)',
  },
  {
    backgroundColor: 'yellow',
    borderColor: 'rgba(106,90,205,1)',
  },
  {
    backgroundColor: 'rgba(148,159,177,0.2)',
    borderColor: 'rgba(148,159,177,1)',

  }
];

// Pie
public pieChartLabels:string[] = ['First Set', 'Sales', 'Mail'];
public pieChartData:number[] = [300, 500, 100];
public pieChartType:string = 'pie';
Run Code Online (Sandbox Code Playgroud)

我的看法:

<canvas
  [chartType]="pieChartType"
  [colors]="pieChartColors"
  [data]="pieChartData"
  [labels]="pieChartLabels"
  baseChart
></canvas>
Run Code Online (Sandbox Code Playgroud)

javascript charts chart.js angular

5
推荐指数
2
解决办法
5859
查看次数

React datepicker 设置最小和最大日期

我在我的项目中使用 react-datepicker。
我只需要显示特定月份的天数(比如 2020 年 2 月)。我的印象是我可以将 iso 日期作为 minDate 和 maxDate 传递,但这似乎不起作用。

我的代码:

   const DatePickerMod = () => {
    const [startDate, setStartDate] = useState(null);
  return (
    <DatePicker
      selected={startDate}
      onChange={date => setStartDate(date)}
      minDate={'02-01-2020'}
      maxDate={'02-29-2020}
      placeholderText="Select a date in February 2020"
    />
  );
  };
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-datepicker

2
推荐指数
1
解决办法
9096
查看次数

CSS过渡删除border-radius属性

我正在创建一个CSS转换,在父状态悬停时缩放内部元素.

但是,父级具有border-radius不会强制实际悬停的属性.当用户悬停元素时,没有显示border-radius.

我发现这与溢出有关,我试图让z-index父母高于孩子,但没有运气.

我的小提琴:https: //jsfiddle.net/muLhkx9m/1/

html css css3 css-animations

1
推荐指数
1
解决办法
984
查看次数

useState 未使用 socket.io 正确更新

我正在通过 socket.io 提取数据,但是当侦听来自服务器的传入消息时,我的状态未正确更新。

我可以看到数据正在从套接字中正确提取(每秒 50 个请求),但setQuotes 只是用从服务器返回的新项目替换现有项目(因此我的状态的长度始终为 1)。

  const [quotes, setQuotes] = useState([])
 const subscribe = () => {
    let getQuote = 'quote.subscribe';
    socket.emit(getQuote, {});
    socket.on('listenAction', function (msg) {
        setQuotes([...quotes, msg]) // This just replace the entire state instead of adding items to the existing array
    }); 
}
Run Code Online (Sandbox Code Playgroud)

Subscribe // 打开网络套接字流

state websocket socket.io reactjs react-hooks

1
推荐指数
1
解决办法
1505
查看次数