Generate pdf of chart obtained through chart.js in django - django

I want generate pdf of a template containing chart generated through chart.js and also table ,I have used reportlab but I neither get chart generated through chart.js nor css is applied over the table in django ?

You can use wkhtmltopdf for these things and for converting dynamics chart into pdf you should always consider some stable library which supports different type of chart and wkhtmltopdf is good in that. It is easy to work with wkhtmltopdf in your Django app.

Related

Always Enable Tooltip : Chart JS : V3 : Bubble Chart : react-chartjs-2

I am trying to always enable all the tooltips for Bubble chart using react-charjs-2 plugin
I tried various approaches but none of them work with the latest version of the plugin
Would appreciate some advice, Thank you! :)
I tried the all possible approaches, including the following ones, but was unable to achieve the results
Tried the following:
Chart JS: Always show tooltips in a multi dataset line chart
By default it is not possible to show all the tooltips at once, if you really want it you will need to use the external (html) tooltip.
The easyer way is to use the datalabels plugin: https://chartjs-plugin-datalabels.netlify.app/samples/charts/bubble.html

oracle apex 18.2 chart conditional formatting

As i am totally newbie to oracle apex technologies i am developing a simple chart application in which I have build a simple Bar Chart in apex 18.2, i want to do some conditional changes on chart on the basis of data retrieving from database , i didn't found any HTML expression box to enter custom HTML Expression , I need some Suggestion or Some good examples for to Customize the Chart behavior via css or java script , i have done googling but didn't found any useful material for apex 18.2 as all of examples are for some older versions.
Charts in APEX 18.2 are based on Oracle JET engine. If you're going spend more time on charts development, I advice you to check out this toolkit, and how it works. (https://www.oracle.com/webfolder/technetwork/jet/globalGetStarted.html)
If you just need a quick suggestions how to customize chart behavior then:
-set a static ID for your chart in application builder. It should be static ID of whole chart region, not just particular series.
-in the application use developer tools to figure out how chart widget works. In console you can easly catch the widget by jQuery selector $("#yourStaticID_jet"). "_jet" is crucial here. On this jQuery object you can use method ojChart() to interact with chart widget.
All available options for ojChart method are documented here: https://docs.oracle.com/cd/E87657_01/jet/reference-jet/oj.ojChart.html
At the beginning you can try:
$("#yourStaticID_jet").ojChart("option");
what should return object with all current options of the widget. Many of them let you impact the way your chart works. Some of them are not possible to set from application builder.
When you decide to change something dynamicly you can create Dynamic Action (for e.g. on some button) and choose type of action "Execute JavaScript Code". A nice example would be turning on stack property of your chart:
$("#yourStaticID_jet").ojChart({stack: 'on'});
There is also way to initialize your chart with some options. For this purpose go to Attribute section of your chart, and scroll down to "Advanced" JavaScript Initialization Code. Help text for this section will provide you example code.

Chart.js custom tooltip events

I m working on charts using the chart.js library. I want to show image gallery like a carousel on click of any segment of pie/doughnut chart. I'm not able to find the proper solution. Please suggest some solution
If I understand correctly what you are trying is to trigger an event after user clicks on chart segment. chart.js has this prototype method getElementAtEvent(); See the documentation.
It seems as a good place to start - you could create some function to open image gallery and call it there.
And the gallery/slider implementation is a separate issue, but if you are using some of the popular ui libraries some of them have a solution for that already. Bootstrap, for example has carousel, and JQuery has many plugins for that purpose. Here are some examples. Hope this helps...

Creating a RaphaelJS pie chart without a plugin

I know a pie chart plugin exists for Raphael JS, but I need to add extra programming that doesn't exist in it. How do you create a pie chart in Raphael JS from scratch?
I'd have a look at the code thats used on this page. That's how I created my piecharts

Using Google Annotated Time Line Chart Without Flash

I want a similar behavior Chart as Google Annotated Time Line Chart to display my Time Series Data from DataBase In our environment we are restricted using Flash .
But i see that Google Annotated Time Line Chart works only with Flash .
I want a similar behavior as of Google Annotated Time Line Chart showing two charts , where the below Chart helps us to select a Range and the Upper Chart displays the Zoomed Area .
I wanted to develop this by taking two divs , but i am struck up as how to maintain synchronization between these two divs (Chart Div and Slider Div)
If anybody developed has developed Google Annotated Time Line Chart Without Flash , please give some inputs as how to develop this .
Thank you very much for reading .
check out https://code.google.com/apis/ajax/playground/?type=visualization#chartrangefilter_control
I believe you can do simple annotations also using data roles 'annotation' and 'annotationtext' (not too much styling though). You can find more info here https://developers.google.com/chart/interactive/docs/roles.
I just ran into this:
http://www.highcharts.com/demo/dynamic-master-detail
It's not free but it looks interesting.
there is no other way to make charts in Google without Flash at the moment