Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Static `Plot.tip` marks does not work with JSDOM

Đang mở
#2,187 1 bình luận 0 reaction 0 người được giao Xem trên GitHub

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
45/100
Loại issue
Lỗi
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Đình trệ
Công nghệ
d3, javascript

Hướng nghiên cứu

Điểm bắt đầu có thể tái lập là Plot.tip với một tài liệu JSDOM; trước tiên hãy chạy ví dụ được cung cấp và so sánh đầu ra SVG của nó với phần kết xuất trong tài liệu được liên kết. Công việc được xem là hoàn tất khi các tip tĩnh được kết xuất chính xác trong SVG do JSDOM tạo ra, giống như trong bản tham chiếu.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

enhancement

Hi observableHQ plot team,

It seems like Plot.tip does not work with the JSDom renderer.

For example, the following code

(sample code)

import * as Plot from "@observablehq/plot";
import * as d3 from "d3";
import {JSDOM} from "jsdom";

const aapl = d3.csvParse(await readFile("./aapl.csv", "utf-8"), d3.autoType);
const plot = Plot.plot({
  document: new JSDOM("").window.document,
  y: {grid: true},
  marks: [
    Plot.lineY(aapl, {x: "Date", y: "Close"}),
    Plot.tip(
      [`Apple stock reaches a new high of $133 on Feb. 23, 2015. The release of the first Apple Watch, slated for April, is hotly anticipated.`],
      {x: new Date("2015-02-23"), y: 133, dy: -3, anchor: "bottom"}
    ),
    Plot.tip(
      [`Apple stock drops 8% after the company misses Q2 revenue targets and reports declining iPhone sales. It reaches a two-year low of $90.34 on May 12.`],
      {x: new Date("2016-05-12"), y: 90.34, dy: 3, anchor: "top"}
    )
  ]
})

plot.setAttributeNS("http://www.w3.org/2000/xmlns/", "xmlns", "http://www.w3.org/2000/svg");
plot.setAttributeNS("http://www.w3.org/2000/xmlns/", "xmlns:xlink", "http://www.w3.org/1999/xlink");

process.stdout.write(plot.outerHTML);

results in an SVG which looks like following.

image

This example is taken from the documentation, which has the reference rendering with the tips:

image

Possibly related issue: https://github.com/observablehq/plot/issues/2160

Ngôn ngữ chính
HTML
Star
5.4k
Fork
246
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. 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.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của observablehq/plot

Tất cả issue của observablehq/plot

Issue tương tự

Thêm issue về Data Visualization

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.