I tried creating a angular2 service which would read the json file and return the contents which would be consumed by the component and draw a bubble-chart using D3.
The http service is returning me the json contents but there is some issue in generating D3 bubblechart. I am not able to get the exact error for not generating the chart in plunker. My plunker url
But when I tried in my localhost, the chrome browser gives me the error as below
angular2-polyfills.js:487 Unhandled Promise rejection: EXCEPTION: Error in :0:0
ORIGINAL EXCEPTION: ReferenceError: d3 is not defined
ORIGINAL STACKTRACE:
ReferenceError: d3 is not defined
at new BubbleChartComponent (http://localhost:55568/appScripts/BubbleChartComponent.js:18:22)
at AppView._View_BubbleChartComponent_Host0.createInternal (BubbleChartComponent_Host.template.js:20:36)
at AppView.create (https://code.angularjs.org/2.0.0-beta.16/angular2.dev.js:22641:23)
at ComponentFactory.create (https://code.angularjs.org/2.0.0-beta.16/angular2.dev.js:7668:34)
at https://code.angularjs.org/2.0.0-beta.16/angular2.dev.js:8215:40
at https://code.angularjs.org/2.0.0-beta.16/angular2.dev.js:8192:20
at ZoneDelegate.invoke (https://code.angularjs.org/2.0.0-beta.16/angular2-polyfills.js:349:29)
at Object.onInvoke (https://code.angularjs.org/2.0.0-beta.16/angular2.dev.js:2185:31)
at ZoneDelegate.invoke (https://code.angularjs.org/2.0.0-beta.16/angular2-polyfills.js:348:35)
at Zone.run (https://code.angularjs.org/2.0.0-beta.16/angular2-polyfills.js:242:44)
any idea what is it I am missing?
Related
I am using angular google map npm (https://github.com/angular/components/blob/main/src/google-maps/map-polyline/README.md) for mapping page. Now I try to get new polyline path after polylineDragend event. The polylineDragend event is perfectly triggered, but I didn't get path while using getPath(). How to get path after polylineDragend event.
I am getting getPath() is not a function error.
I am trying to display tip when mouse is anywhere on the graph which will look like below( see India Total Cases) :
I tried this solution but it gives me an error:
slider_chart.html:962 Uncaught TypeError: child._hideDot is not a function
at SVGCircleElement.<anonymous> (slider_chart.html:962)
at Pt.each (d3.v5.min.js:2)
at slider_chart.html:952
at Array.forEach (<anonymous>)
at SVGSVGElement.<anonymous> (slider_chart.html:951)
at SVGSVGElement.<anonymous> (d3.v5.min.js:2)
Line no 935-983:
https://blockbuilder.org/ninjakx/241d14a27427dd89133e1b07919ee9b6
I am trying to implement it for 1st graph then will do the same for rest of the graphs but I am getting this error not a function. I tried searching on google but could not find any solution for it.
My 1st chart (total_chart) is defined under function total_cases_chart() Line no. 863-983.
Having difficulty making this example
https://dc-js.github.io/dc.js/examples/compare-unfiltered.html
work with rowcharts.
JS Fiddle here https://jsfiddle.net/v3na78c2/2/
In the jsfiddle it partially works but only the first chart after resetAll is clicked. Other charts don't render at all.
In my environment I get the following exception.
dc.js:8802 Uncaught TypeError: child.rescale is not a function
at dc.js:8802
at Array.forEach (<anonymous>)
at Object.rescale (dc.js:8801)
at Object._chart.compose (dc.js:9085)
at metrics.js:1085
at Array.forEach (<anonymous>)
at createCharts (metrics.js:1011)
at Class.<anonymous> (metrics.js:1358)
at fn (backburner.js:638)
at invoke (backburner.js:258)
I have setup a Node.js server to render a simple d3 circle.
app.get('/circles',function(req, res) {
res.render('circles');
});
The view engine is jade. Here is the jade template. I refer my java script libraries which are present in the public folder.
doctype html
html
head
title Enterprise dashboard
h1 Welcome to Visualization
link(rel='stylesheet', href='/stylesheets/style.css')
script(src='/javascripts/jquery-1.8.2.min.js')
script(src='/javascripts/d3.min.js')
script(src='/javascripts/d3circles.js')
body(id='idofbody')
div(id='circle')
div(id='circle1')
When I access this from a browser, everything works fine. The d3 visualization works rendering the single circle.
I am trying to make ajax call to the '/circles' from a qlikview extension. But the page returned shows only the static part like h1 tag. The SVG that was made with the script in d3 call circles is not rendered.
The fire bug output shows this. As you can notice, the first GET is the call I made from qlikview extension. The second call is unexpected. When rendering the page, it makes a GET call to the script library with a wrong url-url of the Origin. The url refers the origin and hence becomes unsuccesful I beleive.
note:I can't post the full output from firebug(with all GET calls) as screenshot due to lesser points in my side.
GET http://25.25.80.63:8765/circles 200 OK
3.49s QvAjax.js (line 23)
GET http://25.25.80.63/javascripts/jquery-1.8.2.min.js 404 Not Found 151ms QvAjax.js (line 23)
But the problem occurs only within qlikview. When I do the same ajax call, from a page in a different node server, the script and css libraries are referred with the correct url - the url of the HOST.
Please suggest how to render D3 components into qlikview from the node server.
I have a button, onclick of which I'm doing an AJAX call to one of my pages (which contains jqplot elements).
Now, the AJAX req/res works fine for the first click of the button.
When I click my button for the second time, I get an exception saying,
Uncaught Error: can't load XRegExp twice in the same frame
And it points to the jQuery-min file. Any idea on how I can solve this issue?
I have tried this solution and it does not work.
I think the handler is getting "attached" before the DOM element in question actually exists.
Try using jquery.on().