Hi, your excellent free plugin works fine with Amcharts 4.
https://www.amcharts.com/docs/v4/tutorials/using-amcharts-wordpress-plugin/
But there appears to be no documentation for working with Amcharts 5. The demos will not render in WordPress. There seems to be no actual WordPress specific docs for Amcharts 5.
Can you share details on how to successfully implement the demo graphs using only the WordPress plugin?
Example: Create a Clustered Bar Chart (Demo: https://www.amcharts.com/demos/clustered-bar-chart/ )
Please specify what modifications are necessary to get the demo javscript to work perfectly with the plugin interface.
Assume the end user has zero knowledge of javascript.
]]>Hello,
I have been trying to make a chart multilingual (catalan, english, spanish) and I can’t see any obvious way to do it. Although in the pluguin faqs it says it is wpml ready, in “Charts and maps” I don’t see any column to add variations (between title and date) for each language (as you would do with a regular post, for example).
Do I need to work with the translations in some other way?
pluguin version: 1.4.1
Wpml version: 4.5.14
Thanks in advanced.
Only the first subsite in a wordpress multisite network has access to the menu.
Wonder if it can be extended to multisites.
]]>Hello everybody,
I request your help as the WordPress amCharts plugin doesn’t seem to work anymore for some charts. On my website I had several amcharts, and for few days some of them are not displayed anymore, like bar chart race and stacked bar chart, while I have not changed anything on the website for weeks.
You can try to use the WP plugin with the code of the bar chart race shared on the Chart Demos – amCharts’ page, and you will se that when you click on “preview chart or map”, nothing is displayed. Just a blank space and the amCharts logo. Do you know what I can do? Do you have the same issue?
Your help would be very very appreciated.
Kind regards,
Thomas
]]>Hello everybody,
I request your help as some amcharts on my website, displayed through the WP AmCharts plugin, are not dipslayed anymore (bar chart race and stacked bar chart). Few days ago everything was working properly, and all the charts were displayed on the website. I have not changed anything on the website since that time, and now the charts have disappeared.
Even when I click on “preview chart or map” on the plug in with the exact code of the bar chart race demo, nothing is displayed. I just have a blank space and the logo of AmCharts5. Do you have the same thing? Do you know what to do?
Any help would be very appreciated.
Kind regards,
Thomas Jerejian
]]>Hello everabody,
I am trying to implement charts into a new webpage using amcharts. Implementing the charts works but I have troubles using the dataloader to use data from a csv file I have uploaded to wp Media.
Resources:
//www.amcharts.com/lib/5/index.js
//www.amcharts.com/lib/5/xy.js
//www.amcharts.com/lib/5/themes/Animated.jsHTML:
<div id="$CHART$" style="width: 100%; height: 300px;"></div>Java Script:
// Create root element
// https://www.amcharts.com/docs/v5/getting-started/#Root_element
var root = am5.Root.new("$CHART$");
// Set themes
// https://www.amcharts.com/docs/v5/concepts/themes/
root.setThemes([
am5themes_Animated.new(root)
]);
// Create chart
// https://www.amcharts.com/docs/v5/charts/xy-chart/
var chart = root.container.children.push(am5xy.XYChart.new(root, {
panX: true,
panY: true,
wheelX: "panX",
wheelY: "zoomX",
pinchZoomX:true
dataSets: [{
dataLoader: {
url: "https://*******.******/wp-content/uploads/2022/12/SingleDual_v2_4m_2.83.csv",
format: "csv",
delimiter: ",", // column separator
useColumnNames: true, // use first row for column names
skip: 1 // skip header row
}
}]
}));
// Create axes
// https://www.amcharts.com/docs/v5/charts/xy-chart/axes/
var xAxis = chart.xAxes.push(am5xy.ValueAxis.new(root, {
logarithmic: true,
renderer: am5xy.AxisRendererX.new(root, {})
}));
var yAxis = chart.yAxes.push(am5xy.ValueAxis.new(root, {
renderer: am5xy.AxisRendererY.new(root, {})
}));
// Add series
// https://www.amcharts.com/docs/v5/charts/xy-chart/series/
var series = chart.series.push(am5xy.LineSeries.new(root, {
xAxis: xAxis,
yAxis: yAxis,
valueYField: "single",
valueXField: "freq",
tooltip: am5.Tooltip.new(root, {
labelText: "{valueX}: {valueY}"
})
}));
series.strokes.template.setAll({
strokeWidth: 3
});
series.data.setAll(data);
// Make stuff animate on load
// https://www.amcharts.com/docs/v5/concepts/animations/
series.appear(1000);
chart.appear(1000, 100);I understand that the code would not work like this but I have not found the correct way to implement the dataloader in wordpress in an example. Only in the github example is in github I understand. And the shortcode example to load a csv via shortcode does not help me to understand how to than use the csv data in Javascript as data for the chart?
Kind regards,
Finn
]]>Hi,
Searched all over, but can’t find the property that will allow me to suppress a graph’s yAxis grid line. I just want to suppress the grid lines inside the chart, not the leftmost yAxis.
For Amcharts 4, it appears this works:
valueAxis.renderer.grid.template.disabled = true;
But for Amchart 5, I keep getting a non-existent property error for “grid”.
Thx!
]]>Hi
I’m trying to set up a responsive legend:
– there are only 3 items in the legend, so I’d like to have a single row.
– works fine for desktop, but mobile resolves to 2 rows (2 items in the first and 1 item in the second row).
– the responsive wrapper works fine – I can make other changes to fontsize, color, etc for mobile.
Other than this one issue, the responsive function works fine!
// adjust legend – horiz pos
legend.setAll ( {
y: null,
centerY: null,
x: am5.p50,
centerX: am5.percent ( 50 ),
dx: 0,
dy: 0,
layout: am5.GridLayout.new ( root, {
maxColumns: 3,
maxRows: 1,
fixedWidthGrid: false,
} )
} );
// adjust labels
legend.labels.template.setAll ( {
fontSize: “.8rem”,
fontWeight: “300”,
maxWidth: 20,
// notes
// – the following params don;t seem to work with multi-column grids
// oversizedBehavior: “truncate”,
// ellipsis: “…”,
} );`
`etc…
I have a map created in Amcharts4 that I want to put into a WordPress page using the Amcharts WordPress adapter. I am using dynamic data from a php page to fill the data for polygon series.
worldSeries.datasource.url = “/data_adapters/JMA_data.php?O=CMI”;
worldSeries.dataSource.parser = new am4core.JSONParser();
worldSeries.dataSource.Load();
/data_adapters/JMA_data.php does a database query and echos a json string.
I can call it from the server using the url: https://yorkriteconference.org/amcharts_4d/index_T2_dev.html and it works fine.
When I put the javascript into the adapter, the data cannot load.
Any help would be greatly appreciated!
Rod Wagoner
Tucson, AZ
By default, the XY chart is a horizontal graph, can I change it to be vertical?
]]>Is it possible to remove the labels/line that is touching the chart?
I only want the legends at the bottom.
]]>I’m currently using the chart.appear(2000, 500); code.
Is there a way to delay the animation for when you actually scroll to the section with the charts?
]]>Thank you for the great plugin and the awesome library.
I was wondering how to add a value that’s not numeric but custom text. In the chart I attached a link to, the value at the bottom (for Quebec) is “Data not available”. Unfortunately, I added % to the text displayed for the series.bullets.push function, so that numeric values have that displayed. Is there a better way of handling it so that I can display numeric values with the percentage sign, but % is not displayed for the custom text?
]]>Hi,
Are 3D Pie Charts available with the free plug-in?
If yes, how do you switch a regular pie chart to a 3D? I installed the latest plug-in and it’s using:
//www.amcharts.com/lib/5/index.js
//www.amcharts.com/lib/5/percent.js
//www.amcharts.com/lib/5/themes/Animated.js
If you could direct me to a documentation page for variations that would be great. ??
Many thanks!
]]>hi i want to use this plugin but i don’t know my website can handle it or not.
please help.
I use Amchart plugin, and responsive functions run right. But to visualize it in a final page I insert the code [amcharts id="chart-41"], in a wordpress page, it runs, but some elements like buttons don′t change size when I change screen size, they stop being responsive.
varbutton = buttons.children.push(am5.Button.new(root,
Hi there,
I have a problem when I want to use different charts of same type in the same page. Usually, the last one loads fully but the first one does not show properly or load at all.
https://jsfiddle.net/kqpo5aeL/
What’s the problem here?
Thanks a lot.
]]>Hello,
Whats the amcharts4 config for setting specific colors to columns by category when loading data with json?
amCharts3 had a graphs config like below to add colors to a specific category.
graphs": [{
"balloonText": "<b>title</b><br><span style='font-size:14px'>category: <b>value</b></span>",
"fillAlphas": 0.8,
"labelText": "value",
"lineAlpha": 0.3,
"title": "Green",
"type": "column",
"color": "#000000",
"fillColors": "#009925",
"valueField": "Green"
}, {
"balloonText": "<b>title</b><br><span style='font-size:14px'>category: <b>value</b></span>",
"fillAlphas": 0.8,
"labelText": "value",
"lineAlpha": 0.3,
"title": "Red",
"type": "column",
"color": "#000000",
"fillColors": "#d21502",
"valueField": "Red"
}Hi Martyn,
first of all – love this plugin. Great job!
Is there any way I can add revisions to the charts?
kind regards
~Seb
Hello
It is possible to disbale/remove the function to scoll in/out of the map. Can we just remove some code to have a static Map Image with the plusating bullets.
If possible can you share what needs to be removed/added ?
Thanks
]]>Hi, I have a type of custom post, called “valoraciones” in which I have custom fields added. I’m trying to use a custom field for score data in a gauge chart and I can’t figure out how to do it.
This is the data that you would have to use as a “score”:
$score_calidad_muscular = get_post_meta( get_the_ID(), 'calidad_muscular', true );
And what occurred to me so far would be to do the following:
[amcharts id="pie-1" data-score="$score_calidad_muscular"]
Any help or an example to base myself on.
Thank you very much in advance.
Hi there.
We hope to display the increase and decrease arrows and related line chart graph pictures for each woocommerce product.
Is it possible to create it and sync with Google Spreadsheet?
Can this plugin do it?
Thank you!
]]>Hi,
I′d like to use Amcharts shortcodes to display some charts in multiple tabs on a single page.
The first chart [amcharts id=”chart-1″] displays in the first div as expected.
However, clicking on subsequent tabs reveals blank divs. The charts won′t display.
***
The documentation provides an explanation here:
https://www.amcharts.com/docs/v3/tutorials/displaying-charts-in-tabs-or-other-dynamic-page-elements/
and a fiddle: https://jsfiddle.net/amcharts/mZ2Gq/
So guessing that this chart.invalidateSize code should go in the javascript input field for the Amcharts wordpress plugin. Something like this perhaps?
$(function() {
$( "#tab" ).tabs({
select: function(event, ui) {
console.log('Calling chart.invalidateSize()');
chart.invalidateSize();
}
});
});Using that code example creates an a TypeError in the javascript console.
What code is needed to make it run correctly in WordPress?
]]>Hi, I am new to this and I am developing a dashboard using amcharts to visualize the data.
I created a gauge chart and I want the hand to start at 0 and go to a given value, taking 1000 milliseconds but I can’t get it to work.
So far I have the following code.
Thank you very much in advance.
/**
* Hand
*/
var hand = chart.hands.push(new am4charts.ClockHand());
hand.axis = axis2;
hand.innerRadius = am4core.percent(80);
hand.startWidth = 8;
hand.pin.disabled = true;
hand.showValue(0, 1000, data.score);
hand.fill = am4core.color("#FFFFFF");
hand.stroke = am4core.color("#FFFFFF");Hi there,
How I can add Persian Date ( jalali ) to this plugin?
Which part of source must be used for this action?
]]>Hi there,
I am trying to implement a sunburst chart from the AMCharts Demo Example site.
But I don’t know how to add it to my wordpress site using your plugin.
It is this demo here:
https://www.amcharts.com/demos/sunburst-chart/?theme=dataviz
Can you help me please?
]]>We’re getting an error when the light.js file is enqueued. It seems that it’s appending the home_url before the URL of the file like so: home_urlhttps//www.amcharts.com/lib/3/themes/light.js?ver=1.2
All the other files seem to be enqueuing ok. Just this file gets that error.
]]>Have installed this plugin, but not sure how to use it. And there doesn’t seem to be any documentation/tutorial for how to create and display a chart.
]]>How can an amCharts license be applied via the WordPress plugin?
At the moment, I have it at the beginning of the chart code, but obviously this means the license can be seen in the web page source code.
I’m sure there must be another way, if anyone knows how please?
]]>Hello,
I’d like to use the Gantt chart from here:
https://www.amcharts.com/demos-v3/gantt-chart-dates-v3/#code
However when displaying it on my site it gets stretched (Y-Axis) every second. It starts out fine but creates a page that gets longer and longer.
I tried disabling my other plugins, that didn’t help.
Is there something I might need to change from copy-pasting?
Thanks in advance
Richard