2016-08-15 118 views
1

我很努力地把d3 svg中的一個項目移植到d3畫布上,我所擁有的基本上是通過刷刷的Focus + Context,它是經典示例http://bl.ocks.org/mbostock/1667367的衍生品,我有一個簡單線圖而不是面積圖,但原理完全相同。d3畫布筆刷/選擇

現在,我成功設法將折線圖從ol'good svg d3轉換爲新的畫布驅動方式。只是爲了澄清:

   ctx.beginPath(); 
       draw_line.context(ctx)(data); 
       ctx.lineWidth = 0.6; 
       ctx.strokeStyle = "rgb(26,188,156)"; 
       ctx.stroke(); 

這就是我們談論的東西。

現在,由於我在canvas領域,我的印象是所有「svg相關」的東西都不再起作用,因爲它全部都繼承了從svg中取出的「g」對象,到期出於這個原因,像「刷子」這樣的東西似乎不再起作用,這導致我在這裏。

我看過一些例子,通過滾動和像這樣的東西(例如http://bl.ocks.org/jgbos/9752277),再加上我已經看到,你可以很容易地檢測與畫布的滾動事件,但它是真棒,讓我保持完全相同我曾經有過的方法(通過刷牙方法的重點+上下文)

有沒有任何解決方法,以在D3中使用canvas完成工作?

+0

的'd3'刷是一**控件**使用SVG創建,所以要使用它,您需要一些SVG組件。你最終的目標是什麼?你爲什麼要離開SVG?除非你有非常複雜的(即內存密集型)可視化,否則它在很多方面都優於畫布。我想你總是可以在這個[示例]中混合使用這兩個(http://bl.ocks.org/mbostock/0d20834e3d5a46138752f86b9b79727e) – Mark

+2

是的,我結束了混合這兩個,是的,我需要畫布,因爲我是處理huuuuge的數據量。只是爲了記錄,這兩個東西的混合它真正的痛苦屁股:) – holographix

+2

你可以做你的工作的一個小提琴如何結束混合SVG和畫布,因爲我面臨同樣的問題,因爲我搬到大量的數據畫布,現在我想通過刷牙的方式,重點+上下文。 – Achilles

回答