Angular2 SVG過濾網址

我使用Angular2 + D3創建圖表。
我想將svg過濾器應用於酒吧以創建陰影效果。
在創建過濾器並且條紋應用了filter: url("#dropshadow")樣式時，陰影不會呈現。
這可能是由於安格拉斯單頁和url()找不到過濾器？解決這個問題的正確方法是什麼？Angular2 SVG過濾網址

來源

2016-09-06 TommyF

請顯示驗證碼。你在Angular2應用程序之外嘗試過嗎？你是如何設置''和'APP_BASE_HREF'？ –

' ...'in'index.html'。我沒有設置APP_BASE_HREF，我應該嗎？它確實在角度之外工作......如果我找不到解決方案，代碼有點太大，無法發佈，我將創建一個更小的示例來重現問題... – TommyF

我已經看到它提到了' base href =「...」>'可以打破SVG。嘗試設置（提供）'APP_BASE_HREF'來配置路由器。如果是路由器，那麼你可以提供'APP_BASE_HREF'並省略基本標籤。 –

我終於明白了。最好的解決辦法似乎是通過

import { Location } from '@angular/common'; 
... 
constructor(private location: Location)

注入的位置，然後用它來指定url()

.style('filter', 'url(' + this.location.path() + '#drop-shadow)')

現在的作品如預期的路徑。

來源

2016-09-06 11:31:14 TommyF

在我最終將問題追溯到ng2路由器和SVG過濾器衝突之前，花了幾個小時試圖解決這個問題。最終發現這一點，現在它完美的工作。非常感激！ – jrdnmdhl

Angular2 SVG過濾網址

回答

相關問題