簡體 English 中英

在圖片上畫線 - Javascript？

[英]Drawing line over picture - Javascript?

原文 2012-12-02 11:59:46 1 2 javascript/ graph/ drawing/ line

我的頁面上有一些圖表。 當用戶將光標拖到圖片上時，我想在圖表上顯示一條水平線。

在此輸入圖像描述

上面的那個是起點，后者顯示當用戶將光標指向圖表時應該發生什么。 當光線在圖像上方時，該線應與光標保持在同一水平。

例如，Javascript可以實現嗎？

它是，你需要一個div盒，位於光標Y值，1px綠色邊框。 位置必須設置為絕對值。 但你無法直接在圖像中繪畫。

您可以使用D3，並基於svg繪制圖形和懸停線，您可以添加其他圖形組件進行交互，例如滑塊以選擇子區間放大，更改標簽等。

以此為例進行開發： http ： //mpf.vis.ywng.cloudbees.net/

（你可以拖動黃色欄，然后點擊圖例;對於源代碼，點擊github上的fork me）

Javascript Canvas：畫圖

[英]Javascript Canvas: Drawing over picture

[英]Drawing line in a div with Javascript

[英]Loop logic for drawing line javascript

[英]drawing a straight line with arrow in Javascript

[英]Javascript Midpoint Line Drawing Algorithm

[英]black line when hovering over a picture

[英]Why is my line not drawing over time?

[英]Freeform drawing over an image using <canvas> and javascript

[英]Drawing lines over static images with JavaScript

[英]How do I animate drawing a line in Javascript

暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 Javascript Canvas：畫圖用JavaScript在div中畫線畫線JavaScript的循環邏輯在 Javascript 中畫一條帶箭頭的直線 Javascript中點畫線算法將鼠標懸停在圖片上時出現黑線為什么我的線沒有隨着時間推移繪制？使用自由形式繪制圖像 <canvas> 和javascript 使用JavaScript在靜態圖片上畫線如何為Javascript中的線條繪制動畫

相關標簽