小编umi*_*der的帖子

我升级到最新的 Chart.JS 版本 3.0.2。我正在尝试获取要渲染的时间序列图表。这是我的配置：

{
  type: 'line',
  data: {
    datasets: [{
      data: dataForChart
    }]
  },
  options: {
    scales: {
      x: {
        type: 'time'
      }
    }
  }
} 

我已经像这样导入了模块：

import ChartJS from 'chart.js/auto';

我收到的错误是：

Error: This method is not implemented: either no adapter can be found or an incomplete integration was provided.

关于我可能犯的错误有什么建议吗？

这是一个存在该问题的代码沙箱：https://codesandbox.io/s/throbbing-cdn-j6q2u ?file=/src/App.js

我有 PostgreSQL 数据库，其 JSON 类型字段名为“data”，其内容结构如下：

{
  "requestData" : {
    "url": "some url"
    "body": {
      "page_id": 12
    }
  }
}

我尝试使用 SequelizefindAll使用过滤器发出查询请求page_id，但没有得到一些结果。

问题是：我可以按 JSON 类型的嵌套字段进行搜索，还是仅按 JSONB 类型进行搜索？如何？

我当前网页上的图表由 Chart.js v2.5.3 提供支持。不久前配置的图表工作得很好。这是代码：

var ctw = document.getElementById("chart-budget");
var myChart = new Chart(ctw, {
  type: 'bar',
  data: {
    labels: ["budget", "costs"],
    datasets: [{
      label: "Amount",
      data: [520980, 23397.81],
      backgroundColor: [
        'rgba(143, 211, 91, 0.2)',
        'rgba(255, 99, 132, 0.2)',
      ],
      borderColor: [
        'rgba(143, 211, 91,1)',
        'rgba(255, 99, 132, 1)',
      ],
      borderWidth: 1
    }]
  },
  options: {
    legend: {
      display: false
    },
    responsive: true,
    scales: {
      yAxes: [{
        ticks: {
          beginAtZero: true
        },
        gridLines: {
          drawBorder: false,
        }
      }],
      xAxes: [{
        gridLines: …

下面的代码，

有没有办法通过滚动的二十分钟视图获得“实时”？似乎无法在启用此功能的选项中找到任何内容。

ChartJS 版本 2.9.4

import 'chartjs-plugin-zoom';
import { Line } from 'react-chartjs-2';
import 'chartjs-plugin-streaming';

export default () => {
    const data = {
        datasets: [
            {
                label: 'MWC',
                borderColor: 'rgb(255, 99, 132)',
                backgroundColor: 'rgba(255, 99, 132, 0.5)',
                steppedLine: true,
                lineTension: 0,
                borderDash: [8, 4],
                data: new Array(1000).fill(null).map((_, i) => {
                    return {
                        x: new Date(new Date().setTime(new Date().getTime() + (i + 1) * 1000)),
                        y: random(500, 1000),
                    };
                }), // REPLACE THIS WITH REALTIME FEED
            },
        ],
    };

    const options …

直到版本 2.9.4为止，我将 ChartJS 与@types/chart.js结合使用来获取 TypeScript 支持的所有类型。我使用 Webpack 和 TypeScript 的最小工作示例如下所示：

包.json：

{
  "devDependencies": {
    "@types/chart.js": "^2.9.31",
    "ts-loader": "^8.1.0",
    "typescript": "^4.2.3",
    "webpack": "^5.30.0",
    "webpack-cli": "^4.6.0",
    "webpack-dev-server": "^3.11.2"
  },
  "dependencies": {
    "chart.js": "^2.9.4"
  }
}

tsconfig.json：

{
  "compilerOptions": {
    "esModuleInterop": true,
  },
}

webpack.config.json：

module.exports = {
  entry: {
    main: "./main.ts",
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        loader: "ts-loader",
        exclude: /node_modules/,
      },
    ],
  },
};

主要.ts：

import Chart from "chart.js";

new Chart("chart", {
  type: 'line',
  data: { …

我正在使用Visual Studio Code（版本 1.40.1）处理我的Angular 8项目，并通过命令从其终端运行Karma/Jasmine测试ng test。当测试失败时，我总是能够通过Ctrl + click嵌入在堆栈跟踪中的终端链接跳转到相关的源文件。几天后，这不再起作用，而是打开了一个新的 Chrome 浏览器标签。

我认为问题可能与任何最近更新的npm软件包有关。因此，我创建了一个全新的角度8项目（ng new），在做了小改动app.component.spec.ts，并开始ng test。不幸的是，同样的问题也出现在那里。完全卸载并重新安装 VSCode 也无济于事。

关于如何获得原始功能（跳转到源代码）的任何想法？

包.json

{
  "name": "app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.13",
    "@angular/common": "~8.2.13",
    "@angular/compiler": "~8.2.13",
    "@angular/core": "~8.2.13",
    "@angular/forms": "~8.2.13",
    "@angular/platform-browser": "~8.2.13",
    "@angular/platform-browser-dynamic": "~8.2.13",
    "@angular/router": "~8.2.13", …

我试图弄清楚当我将鼠标悬停/鼠标悬停在我绘制的垂直线注释上时如何添加工具提示：

annotation: {
   annotations: [{
      "drawTime": "afterDatasetsDraw",
      "type": "line",
      "mode": "vertical",
      "scaleID": "x-axis-0",
      "value": "2020-04-01 12:20:27.709523",
      "borderWidth": 2,
      "borderColor": "red",
      "label": {
        "content": "Example Content",
        "enabled": true,
        "position": "top"
      },
      onMouseover: function(e) {
        console.log("I AM GETTING CALLED!");
      },
   },

有人能解释一下这是如何做到的吗？

我正在尝试将 Mockito 的参数匹配器传递到嵌套对象值中。到目前为止我已经成功地使用了这样的东西：

when(object.getData(any, any, userId: anyNamed("userId"))).thenAnswer((_) async => response);

但是现在我需要使用anyoranyNamed作为嵌套值。下面的代码：

when(adapterMock.fetch(
  RequestOptions(
    method: anyNamed("method"),
    path: "orders",
  ),
  any,
  any,
)).thenAnswer((_) async =>response);

给出错误：

Invalid argument(s): An ArgumentMatcher was declared as named method, but was not passed as an
argument named method.

BAD:  when(obj.fn(anyNamed: "a")))
GOOD: when(obj.fn(a: anyNamed: "a")))

有没有正确的方法来提供嵌套参数匹配器？

是否可以在组件上应用这样的类或样式？

元素组件

@Component({
  selector: 'app-element',
  templateUrl: './element.component.html',
  styleUrls: ['./element.component.scss']
})

容器组件模板

<app-element class="button"></app-element>

全局.css

.button {
  background :red;
}

我正在尝试使用折线图显示一些数据Chart.js

我当前的图表如下所示：

我想要的输出应显示如下：

我的第一个图表的代码如下：

var chart = new Chart(ctx, {
  type: "line",
  data: {
    labels: This.xAxis,
    datasets: [{
      backgroundColor: gradient,
      pointBackgroundColor: "white",
      borderWidth: 1,
      borderColor: "#5946B0",
      pointRadius: 2,
      displayColors: false,
      data: This.yAxis
    }]
  },
  options: {
    title: {
      display: false,
      text: "Test"
    },
    tooltips: {
      backgroundColor: "#FAFAFA",
      borderColor: "lightgreen",
      borderWidth: 1,
      titleFontColor: "black",
      titleFontStyle: "normal",
      displayColors: false,
      bodyFontColor: "black"
    },
    legend: {
      display: false
    },
    plugins: {
      zoom: {
        pan: {
          enabled: true,
          mode: "x",
          speed: 10,
          threshold: 10 …

示例图像

我想使用打字稿创建自动图像滑块，最终结果应该像这个链接Automatic Slideshow - W3Schools。

export enum r {
  color1 = "Red"
  color2 = "green"
  color3 = "blue"
}

ar = ["color1", "color2"];
ar.map(e => {
  if (r[e as any] !== undefined) {
    return r[e]
  }
})

上面的语句给出“元素隐式具有任何类型，因为索引表达式不是数字类型”

我开发了一项服务，允许我激活按钮并查看其在不同组件中的状态。当我单击开始/暂停时，按钮会更改图像。

在 StackBlitz 中，代码运行良好，但是当我在我的项目中实现它时，该函数只传入一次ngOnInit并且不再加载，不再更改组件之间的按钮图像。

有没有办法实现这个但不使用ngOnInit？

我用过setinterval，按钮改变了图像，但它似乎不是最好的解决方案。

谁能帮我？

闪电战

问题 --- 关于组件

currentState: string;
ngOnInit() {
    this.currentState = this.servicesService.getCurrentState();
}

html

<div class="container" style="margin-top: 10%">
    <div class="btn-group" dropdown>
        <button id="button-basic" dropdownToggle type="button" class="btn ">
            <img style="width: 35px;" *ngIf="currentState=='pause'" src="https://img.icons8.com/carbon-copy/100/000000/play-button-circled.png">
            <img style="width: 35px;" *ngIf="currentState=='start'" src="https://img.icons8.com/cute-clipart/64/000000/stop-squared.png">
        </button>
        <ul id="dropdown-basic" *dropdownMenu class="dropdown-menu" role="menu" aria-labelledby="button-basic">
            <li role="menuitem">
              <a class="dropdown-item" *ngIf="currentState=='pause'" routerLinkActive="active" (click)="startTimer()">Start</a>
            </li>
            <li role="menuitem">
              <a class="dropdown-item" *ngIf="currentState=='start'" routerLinkActive="active" (click)="pauseTimer()">Stop</a>
            </li>
        </ul>
        <div>
            <span>{{servicesService.fetchDisplay()}}</span>
        </div>
    </div>
</div>

成分

 startTimer() …