爲Angular設置d3-tip

對於我的角度項目，我有困難立即爲d3-tip實例化。爲Angular設置d3-tip

我已經運行bower install d3-tip裏面裝D3尖與以下bower.json文件：

{ 
    "name": "d3-tip", 
    "version": "0.6.7", 
    "main": "index.js", 
    "ignore": [ 
    "**/.*", 
    "node_modules", 
    "components", 
    "bower_components", 
    "examples", 
    "Makefile", 
    "docs" 
    ], 
    "dependencies": { 
    "d3": "3.5.5" 
    }, 
    "homepage": "https://github.com/Caged/d3-tip", 
    "_release": "0.6.7", 
    "_resolution": { 
    "type": "version", 
    "tag": "v0.6.7", 
    "commit": "07cf158c54cf1686b3000d784ef55d27b095cc0e" 
    }, 
    "_source": "git://github.com/Caged/d3-tip.git", 
    "_target": "~0.6.6", 
    "_originalSource": "d3-tip" 
}

接着我在D3-tip的文檔中提供的例子中下降，並收到以下錯誤：

TypeError: d3.tip is not a function

代碼：

/* Initialize tooltip */ 
tip = d3.tip().attr('class', 'd3-tip').html(function(d) { return d; }); 

/* Invoke the tip in the context of your visualization */ 
vis.call(tip) 

vis.selectAll('rect') 
    .data(data) 
.enter().append('rect') 
    .attr('width', function() { return x.rangeBand() }) 
    .attr('height', function(d) { return h - y(d) }) 
    .attr('y', function(d) { return y(d) }) 
    .attr('x', function(d, i) { return x(i) }) 
    .on('mouseover', tip.show) 
    .on('mouseout', tip.hide)

然後，想着我需要ŧ Ø實例D3尖在我angular.module，像這樣：

angular.module('d3', []); 
angular 
    .module('bApp', [ 
     'ngAnimate', 
     'ngCookies', 
     'ngResource', 
     'ngRoute', 
     'ngSanitize', 
     'ngTouch', 
     'ui.router', 
     'ct.ui.router.extras', 
     'angularMoment', 
     'd3', 
     'd3-tip', 
     'smart-table', 
     'oitozero.ngSweetAlert', 
     'ui.select', 
     'daterangepicker' 
    ])

哪個扔：

Error: [$injector:modulerr] Failed to instantiate module d3-tip due to:

Error: [$injector:nomod] Module 'd3-tip' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument

我想也試過直接注入D3-尖端插入我使用它的指令本身（它被添加作爲d3Tip而非D3尖端因爲連字符被扔了錯誤）：

angular.module('bApp') 
    .directive('reportChart', ['d3','$parse', '$state', 'd3Tip', function(d3,$parse,$state,d3Tip) {

和GOT：

Error: [$injector:unpr] Unknown provider: d3TipProvider <- d3Tip <- reportChartDirective

那麼，這裏有什麼錯？謝謝！

來源

2015-06-10 Lauren F

它看起來並不像D3-尖的角模塊...所以你不能將它作爲模塊注入你的應用程序。您的d3和d3-tip js文件包含在'index.html'中？ – allienx

對， ''' ' D3一直沒在一個問題所有... d3-tip都以相同的方式包含在內 –

你不需要在任何地方注入它。它在我的網站上沒有注射。

在app.js的情況下刪除D3尖

只需運行

bower install d3-tip --save

感謝

來源

2016-01-22 11:07:08

爲Angular設置d3-tip

回答

相關問題