我如何允許訪問者使用Bootstrap在圖上放置標記？

我正在使用Bootstrap框架呈現響應式網頁的新XPage應用程序（在Domino服務器上）。我所做的大部分工作都非常基礎，而且我之前使用過這些技術。我如何允許訪問者使用Bootstrap在圖上放置標記？

但是，應用程序要求訪問者有能力在固定圖像上放置標記。舉例來說，一個機動車事故索賠表格，申請人被要求指出損害發生在圖上...

我想提出一個靜態圖片，並讓遊客將指標放在該圖像的頂部。然後我想以某種方式保存生成的圖像。如果我無法保存整合圖像，我希望能夠保存訪問者指示器的座標，以便我可以在後端模擬相同的標記圖。

在我可以用來完成這個任務的地方是否有插件或文檔化的技術，或者我應該嘗試「自己推出」？我一直無法找到任何能夠完成這樣的事情。

在此先感謝您的任何建議！

來源

2017-08-31 Terry Boyd

我不知道的引導插件的，但你可以在Annotorious –

看一看保存與註釋的圖像（作爲新的圖像），你應該能夠輕鬆地自己使用HTML5 canvas元素滾到渲染圖像和註釋，然後將內容保存爲新圖像。 –

如果您自己考慮使用

下面是一些jQuery代碼我有將檢測moue點擊的座標：

var locations = []; 
$(document).ready(function() { 

    $("#yourImageId").click(function(e){ 
     var parentOffset = $(this).offset(); 
     var relX = e.pageX - parentOffset.left; 
     var relY = e.pageY - parentOffset.top; 
     var obj = {x: relX, y:relY}; 
     locations.push(obj); 
    }); 

}

現在，您將有所有的點擊座標的全局數組。您可以將其存儲到數據庫中，然後在稍後使用它將標記放在圖像上。

來源

2017-09-13 19:36:08

在畫布中打開圖像並讓用戶在畫布上繪製。將新圖像保存回Domino後。 http://www.xpagedeveloper.com/category/canvas-element

來源

2017-12-05 09:46:51

我如何允許訪問者使用Bootstrap在圖上放置標記？

回答

相關問題