57 comments found.
For the bargraph is there a way to make the labels either permanent at the top or bottom instead of being a mouseover (Or display in the bar itself). Also, I really need to have more than one data point displaying. EG. Currently my label says ;7 Day’ and under it it says ‘Average Price and then the price, 325.44. What I would like are 2 more rows saying ‘ROI 20%’ and ‘Profit $22’.
hi, I’ll try to help. Do you have this posted online somewhere I can take a look? You can go to my profile page https://graphicriver.net/user/psddude/portfolio and share he link there.
In the mean time I will try and come up with a solution for your requests and get back to you
for the first request you can make the barchart with one infographic-bar per infographic-bargroup and put the value in the name of the bargroup. Something like this:
<infographic-bargraph > <infographic-data> <infographic-bargroup name=”330”> <infographic-bar value=”330”>Data 1</infographic-bar> </infographic-bargroup> <infographic-bargroup name=”730”> <infographic-bar value=”730”>Data 1</infographic-bar> </infographic-bargroup> <infographic-bargroup name=”130”> <infographic-bar value=”130”>Data 1</infographic-bar> </infographic-bargroup> </infographic-data> </infographic-bargraph>
and for your second request, you can use simple HTML elements next to the chart with whatever text you need. But, maybe I didn’t understand correctly what you wanted
Yes, I tried that solution but the problem is when you use different labels it breaks. “Data1” needs to be able to be “Data1”, “Data2”, etc.
I solved my requirement by using the HTML and CSS examples you posted in another thread.
I sent you the link to the page in your profile.
Many thanks for getting back to me so quickly and for providing some very useful code.
Hello, one more thing.
Is there a way I can make the chart so it does not add more than one date below the chart for the same day if I have more than one record for one day?
Example: Today is 04/10/2022, and I receive in my database 20 records. Currently, your chart is going to display 20 times the same date. Is there a way I can make it so it displays only ones?
Thank you for your time.
hi, I will try to help you. Can you give me a few more details? What kind of chart do you want to create? for example you can use the line chart x-axis-label parameter to indicate that you don’t display the x labels
Check out the docs here: http://www.coding-dude.com/wp/projects/infographic-charts-graphics-html-tags-library/documentation/
If you tell me exactly what you want or if you can share a link I will try to help you with that. For sending links try sending a message via my profile page
Hello, I wrote to you via the message box in your profile. Please respond to me when you can. Thanks.
Hello, I have bought your chart libraries. I want to ask you if there is anyway already integrated into the library with the help of which I can extract data only for a certain period of time, let’s say 10 days. I already read the documentation but was not able to find anything.
Also, I am trying to make it more beautiful with CSS, but the dates below the infographic line do not have any HTML type, do you know a way I can style those, so they can look more pretty?
you can actually hide the labels generated by the library and add your own HTML around the chart just like a regular HTML element
Hello, before purchasing I would like to ask you, is there anyway we can use it by importing dynamic data from MySQL in the “value” property of the library?
Why have been not update this since 2018?
there was no need to update. Do you need help with this library?
Good morning, my name is Carlos.
I recently purchased your product: “Infographic Charts and Tables HTML Tag Library”. My purchase number is “084517d3-5afc-49b0-8921-67aad1e1cd59 – Sep 25, 2020”.
Please I would like to know if you have documentation for the use of the “infographic-legend” tag. I need it to be displayed in a box, next to the graph.
On the other hand, do you have an example of how to load data from SQL Server or another database engine? Thank you very much for your time.
Best Regards
Carlos Franco
Hi Carlos, thank you for your purchase!
Please see the documentation here: http://www.coding-dude.com/wp/projects/infographic-charts-graphics-html-tags-library/documentation/#legend
As for loading data from a database please see this article for creating a piechart from MySQL data: http://www.coding-dude.com/wp/php/creating-php-mysql-pie-graph/
Hello, I have few questions. 1. Can I load not only from web URL but also local image? If can, how? Because I load from “file:///C:\User\Desktop\xxx.png” get “Not allow load local file” 2. Only type of PNG can be load? Because I turn JPG into PNG can’t be load. please help, thanks. BR Derek
Hi Derek, this is a web library, it cannot load local images, it needs to run inside a webserver.
If you absolutely must load a “local” image, there are workarounds like using image dataURL
That means embedding the image in the source of the page, but it can be cumbersome if you want to use large images.
let me know if you need help with setting that up
Thanks for your help, I have another question “Only type of PNG can be load? Because I turn JPG into PNG can’t be load”
Thanks for your help. BR, Derek
I don’t know exactly what you are trying to do, so please send me a message via my profile so we can talk on email
Trying to create dynamic charts using Javascript. I get raw data instead of charts. Below is my code, and below that, the output. What am I doing wrong?
Thanks.
My code:
<!DOCTYPE html>
<head>
<script src="/JavaScript/infographic.min.js"></script>
</head>
<script>
document.addEventListener("DOMContentLoaded",
function(e) {
drawChart();
}
);
function drawChart() {
var Location = [
['Crackers', 20],
['Chips', 10],
['Candy', 12],
['Cake', 3]
];
var OutString = "<infographic-piechart width=300 height=300 type=piechart><infographic-data>";
for (var i = 0; i < Location.length; i++) {
OutString += "<infographic-pieslice value=" + Location[i][1] + ">" + Location[i][0] + "</infographic-pieslice>";
}
OutString += "</infographic-data></infographic-piechart>";
document.getElementById("PieChart").innerHTML = OutString;
}
</script>
<div align="center" id="PieChart">
</div>
Output: CrackersChipsCandyCake
can you please send me a message via my profile? I will try to help you.
basically this is a HTML tag library and the rendering of the charts is triggered by the onload event on the window
try calling documentLoad() after document.getElementById(“PieChart”).innerHTML = OutString;
That worked. Thanks.
Awesome!
I have a couple of questions please.
- can I insert space between individual bars within bar groups as opposed to just between groups themselves?
- can I display the number value of each bar without needing to hover over it?
- I am also struggling to make the legend appear – nothing is showing.
Please see the code that I’m currently using below (with tokens for the bar values).
Many thanks for your help.
<infographic-bargraph style=”width:100%” width=”100%” height=”300” type=”vertical” font-size=”14px” font-color=”#000000” font-family=”BrandonText-Regular” colors=”#ccc,#34d9c3” padding=”25” max-value=”25” grid-font-size=”14px” grid-color=”#515151” id=”tenancyCreated”>
<infographic-data>
<infographic-bargroup name=”Number of tenancies”> <infographic-bar value=”{{ contact.tenancy_created_company }}”>Your agency</infographic-bar> <infographic-bar value=”{{ contact.tenancy_created_gl }}”>GL average</infographic-bar> </infographic-bargroup>
</infographic-data>
</infographic-bargraph> <infographic-legend for=”tenancyCreated” display=”inline”> </infographic-legend>
I’ve sent you a response via email
Hi author, - I use PieChart, so I can not display legend like : Color : value. Can you help me ?
Hi, I will try to help. You need to give your pie chart an ID and then add a <infographic-legend> tag with the attribute for pointing to that ID.
Check out the documentation, there’s also an example there for the legend: http://www.coding-dude.com/wp/projects/infographic-charts-graphics-html-tags-library/documentation/#legend
Hi Author, In your example code which you send, I can not see Legend in picture. Can you check for me ? Tks.
PLEASE help me, because I get one Issue about this today. Tks.
Hi author, Please help me about this problem. tks so much
hi, can you please send me a message via my profile with a link to where you are using this?
Hi author, I sent html code to you thought your profile. Please help me as soon as possible. Thanks so much.
I’ve sent you the response via email, hope it helps
Hi Author,
My Issue solved. Tks so much 
Super! Let me know if I can help you with anything else and don’t forget to rate!
Hello,
I have a problem with legends.
My code : $query = “SELECT ID_TACHES, TEMPS_EFFECTUER FROM BDD_EFFECTUER group by ID_TACHES”; $result = mysqli_query($db,$query);
<?php
// Performing SQL query// Printing results inside an HTML infographic tag
echo ”<infographic-piechart width=’500’ height=’500’ id=’graph1’>\n”;
echo ”<infographic-data>\n”;
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
$task=$row[‘ID_TACHES’];
$lestaches=mysqli_query($db,”SELECT NOM_TACHES FROM BDD_TACHES WHERE ID_TACHES=’”.$task.”’”)>fetch_object()>NOM_TACHES;
//echo $lestaches;
echo ”<infographic-pieslice value=’” .
$row[‘TEMPS_EFFECTUER’] . ”’>” .
$lestaches .
”</infographic-pieslice>\n”;
}
echo ”<infographic-data>\n”;
echo ”</infographic-piechart>\n”;
echo ”<infographic-legend for=’graph1’></infographic-legend>\n”;
?>
Can you help me?
Thanks for all
Hi,
sure I will help you. Please send me a message via my profile page and I will contact you via email. Please send me the page where you test this and a description of what the problem is
hi, i need decimals on the line graph is this possible? ok, my mistake, all fine :o)
how do i display the values on the line graph..possible without having to mouse-over for tooltips?
hi, please send me a private message on my profile page and I will try to help you via email
I just downloaded the product, but the infographic.min.js file does not come in the zip please help thank
Hi, I will check and give you a response today.
I just downloaded the product, but the infographic.min.js file does not come in the zip, please thank
Hi Felipe, am I missing something?
I double checked the zip file and inside it I can find a folder src and inside that you have the infographic.min.js file
i download again the zip and.. there is!!.. thank!
awesome! let me know if you need help with using the library
yeah, its working but, how can take the data from and csv file?. where i put the direction of the file and how the data is write in the file csv ?
hi, have you tried passing the CSV file in the data-csv attribute? here’s an example of how to do this:
http://www.coding-dude.com/wp/web-design/javascript/infographic-library-charts-graph-tags-v1-0-1/<infographic-linegraph padding=”40” width=”2000” height=”150” line-width=”2” grid-font-family=”sans-serif” grid-color=”#aaaaaa” grid-scale=”2500” max-value=”7500” grid-font-size=”12px” point-size=”3” colors=”#058dc7,#aadff3” font-size=”40px” data-csv=”http://www.coding-dude.com/wp/wp-content/uploads/2014/01/ga.csv”>
</infographic-linegraph>
thank !!! 2 question more!: How can I show the values in the graph, and use hours for those values?
https://ibb.co/cFFHYmI’m not sure I understand, would you send me a private message so that we can continue this on email? thanks
i send you an email.
sent you the info on email, hope you managed to get the result you were looking for
Hello Im looking for information on using the infograph chart in PHP to connect to MSSQL not MYSQL. Do you have any info on that or where I can find it?
Hi,
The library runs client side, so on the server you can use anything you like. The difference between using MySQL and MSSQL is just in the way you connect to the database.
You can read the documentation about connecting to MSSQL from PHP http://php.net/manual/ro/function.mssql-query.php
Bar graph is not displaying. I’m using PHP+SQL to generate data for graph display. The HTML generated looks correct, but instead of displaying the bar graph it simply displays the bar values as text on the screen ? ...
Hi, there’s a number of reasons for which you would get that result. Are you sure you’ve correctly included the JS files in the document? Please send me a private message with the link where you included the script and I will try to help you
Hi,
Your script looks awesome. Is it possible to use this to pull in an RSS< XML, or JSON file and generate a graph dynamically?
Hi,
Thanks! the library has support for pulling CSV data. See here an example http://www.coding-dude.com/wp/web-design/javascript/infographic-library-charts-graph-tags-v1-0-1/ (look for CSV)
I does not support other formats, but you can relatively easy hook up data from any source either via JavaScript or server side code. I can help you with that depending on what it is that you want exactly
kindest regards, John
Hello, I have 2 questions:
1. shapebargraph always shows 10 images? Is there a way 1 can set the number of images? like 4 of 5, or 1 of 2, etc..
2. Are there any examples of using .csv? Can I use 1 csv for multiple charts?
thanks for such a great script… -Michael
Hi Michael,
thank you for using my library
1. the shapebargraph is meant to show percentage data (0-100%) therefore I chose to display that in a scale of 10 image. So, it’s not possible to display a specific number of images
2. The csv data source only works for line graph. Here’s an example http://www.coding-dude.com/wp/web-design/javascript/infographic-library-charts-graph-tags-v1-0-1/
If you have a particular thing that you want to achieve, please send me a message and I will try to help you make it.
hope this helps, John
Hello,
I just purchased this library and it’s great, however it seems that when I load <script src=”/js/infographic.min.js” type=”text/javascript”></script> it somehow conflicts with a drop down menu script I already had in place and the menu no longer works. The menu is made in such a way that it converts to a mobile menu if the sceen size shrinks. I can give you access if needed so you can check it out. Any help or suggestions would be super appreciated.
Also I noticed that it also conflicts with the Google Captcha code.
Can you please write me a private message with the link to your website?
