Plotly table is not working
Chưa có ai nhận issue này.
Đánh giá
- Độ khó
- 3/5
- Thời gian dự kiến
- 1-2 ngày
- Mức phù hợp với người mới
- 42/100
- Loại issue
- Lỗi
- Độ rõ ràng
- Khá rõ ràng
- Mức độ hoạt động
- Đình trệ
- Công nghệ
- angular, typescript
- Lĩnh vực
- frontend
Hướng nghiên cứu
Bắt đầu bằng cách tái hiện bảng trống từ app.module.ts, app.component.ts và app.component.html bằng thiết lập PlotlyViaCDNModule được cung cấp và dữ liệu bảng. So sánh bảng này với các ví dụ biểu đồ đường hoặc biểu đồ phân tán đang hoạt động; issue được hoàn thành khi bảng được cung cấp hiển thị chính xác trong Angular component.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Mô tả
Problem Overview
- plotly table is showing a blank chart in Angular solution
- Note: I have tried the same thing a month back with plotly version 2.2.1 and it was working fine.
Steps Followed
-
Installed plotly in an Angular solution with below commands
npm install plotly.js-dist --save
npm install @types/plotly.js --save
npm install @types/d3 --save -
Rename folder "plotly.js" to "plotly.js-dist" in "node_modules/@types".
Line/Scatter plots works fine with this approach. However, table is showing an empty graph.
Also, tried with PlotlyViaCDNModule - still the issue is same
Below is how the angular component & module files
app.module.ts
import { PlotlyViaCDNModule } from 'angular-plotly.js';
import { CommonModule } from '@angular/common';
PlotlyViaCDNModule.setPlotlyVersion('1.55.2'); // can be latest or any version number (i.e.: '1.40.0')
PlotlyViaCDNModule.setPlotlyBundle('basic');
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
PlotlyViaCDNModule,
CommonModule
],
app.component.ts
export class AppComponent {
public values = [
['Salaries', 'Office', 'Merchandise', 'Legal', 'TOTAL'],
[1200000, 20000, 80000, 2000, 12120000],
[1300000, 20000, 70000, 2000, 130902000],
[1300000, 20000, 120000, 2000, 131222000],
[1400000, 20000, 90000, 2000, 14102000]]
public data = [{
type: 'table',
header: {
values: [["EXPENSES"], ["Q1"],
["Q2"], ["Q3"], ["Q4"]],
align: "center",
line: {width: 1, color: 'black'},
fill: {color: "grey"},
font: {family: "Arial", size: 12, color: "white"}
},
cells: {
values: this.values,
align: "center",
line: {color: "black", width: 1},
font: {family: "Arial", size: 11, color: ["black"]}
}
}]
constructor() {
}
}
app.component.html
<plotly-plot [data]="data">
- Ngôn ngữ chính
- TypeScript
- Star
- 242
- Fork
- 81
- Merge trung bình
- 8 giờ 48 phút
- Pull request đã merge (30 ngày)
- 18
Hướng dẫn đóng góp
Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của plotly/angular-plotly.js
-
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 45/100
plotly/angular-plotly.js#285 · 3 bình luận ·
-
event handlers are not typed Đang mở
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 38/100
plotly/angular-plotly.js#283 ·
-
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 35/100
plotly/angular-plotly.js#281 · 8 bình luận · 2 reaction ·
-
Angular 19 specs won't run Đang mở
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 25/100
plotly/angular-plotly.js#278 · 2 bình luận · 1 reaction ·
-
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 38/100
plotly/angular-plotly.js#276 · 2 bình luận ·
Tất cả issue của plotly/angular-plotly.js
Issue tương tự
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 91/100
-
community first-timers-only good first issue hacktoberfest help wanted low hanging fruit up-for-grabs
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 95/100
-
Daemon passes --experimental-wasm-jspi unconditionally on Node >= 24; Node 26 rejects the flag Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 78/100
Automattic/studio#4908 ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 90/100
-
help wanted
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
hemilabs/ui-monorepo#2332 ·