ppizzuti

Hi, I don’t get any error on my browser console. Given that the website is available only on the internal network, I’ll show you how I defined the chart:
RESOURCES:
//www.amcharts.com/lib/3/amcharts.js
//www.amcharts.com/lib/3/serial.js
//www.amcharts.com/lib/3/style.css
//www.amcharts.com/lib/3/plugins/dataloader/dataloader.min.js

HTML:
<div id=”$CHART$” style=”width: 100%; height: 500px;”></div>

JAVASCRIPT:
var chart;
var chartData = [];
var chartCursor;

AmCharts.ready(function () {
// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.pathToImages = “wp-content/plugins/amcharts-charts-and-maps/images/”;
chart.dataProvider = chartData;
chart.categoryField = “date”;
chart.dataDateFormat = “YYYY-MM-DD”;

// listen for “dataUpdated” event (fired when chart is rendered) and call zoomChart method when it happens
chart.addListener(“dataUpdated”, zoomChart);

// AXES
// category
var categoryAxis = chart.categoryAxis;
categoryAxis.parseDates = true; // as our data is date-based, we set parseDates to true
categoryAxis.minPeriod = “DD”; // our data is daily, so we set minPeriod to DD
categoryAxis.dashLength = 2;
categoryAxis.gridAlpha = 0.15;
categoryAxis.minorGridEnabled = true;
categoryAxis.twoLineMode = true;
categoryAxis.axisColor = “#DADADA”;

// value
var valueAxis = new AmCharts.ValueAxis();
//valueAxis.position=”right”;
valueAxis.axisAlpha = 0.2;
valueAxis.dashLength = 1;
showLastLabel = true;
valueAxis.title = “Statistiche settimanali – Italia”;
chart.addValueAxis(valueAxis);

// GRAPH MALWARE
graph = new AmCharts.AmGraph();
graph.title = “Malware detections”;
graph.valueField = “malware”;
graph.bullet = “round”;
graph.bulletBorderColor = “#FFFFFF”;
graph.bulletBorderThickness = 2;
graph.bulletBorderAlpha = 1;
graph.lineThickness = 2;
graph.lineColor = “#00205B”;
graph.negativeLineColor = “#0352b5”;
graph.balloonText = “category<br><b><span style=’font-size:14px;’>Malware: malware</span></b>”;
graph.hideBulletsCount = 50; // this makes the chart to hide bullets when there are more than 50 series in selection
chart.addGraph(graph);

// GRAPH1 THREATS
var graph1 = new AmCharts.AmGraph();
graph1.title = “Threat detections”;
graph1.valueField = “threats”;
graph1.bullet = “round”;
graph1.bulletBorderColor = “#FFFFFF”;
graph1.bulletBorderThickness = 2;
graph1.bulletBorderAlpha = 1;
graph1.lineThickness = 2;
graph1.lineColor = “#99b5e5”;
graph1.negativeLineColor = “#0352b5”;
graph1.balloonText = “category<br><b><span style=’font-size:14px;’>Threats: threats</span></b>”;
graph1.hideBulletsCount = 50; // this makes the chart to hide bullets when there are more than 50 series in selection
chart.addGraph(graph1);

// GRAPH2 NETWORK
var graph2 = new AmCharts.AmGraph();
graph2.title = “Network attacks”;
graph2.valueField = “network”;
graph2.bullet = “round”;
graph2.bulletBorderColor = “#FFFFFF”;
graph2.bulletBorderThickness = 2;
graph2.bulletBorderAlpha = 1;
graph2.lineThickness = 2;
graph2.lineColor = “#0040FF”;
graph2.negativeLineColor = “#0352b5”;
graph2.balloonText = “category<br><b><span style=’font-size:14px;’>Network: network</span></b>”;
graph2.hideBulletsCount = 50; // this makes the chart to hide bullets when there are more than 50 series in selection
chart.addGraph(graph2);

// CURSOR
var chartCursor = new AmCharts.ChartCursor();
chartCursor.cursorPosition = “mouse”;
chart.addChartCursor(chartCursor);
chartCursor.cursorAlpha = 0.1;
chartCursor.fullWidth = true;
chartCursor.valueLineBalloonEnabled = true;
chart.addChartCursor(chartCursor);

// SCROLLBAR
var chartScrollbar = new AmCharts.ChartScrollbar();
chart.addChartScrollbar(chartScrollbar);

// LEGEND
var legend = new AmCharts.AmLegend();
legend.marginLeft = 110;
legend.useGraphSettings = true;
chart.addLegend(legend);

// WRITE
chart.write(“%CHART%”);

loadCSV(“wp-content/plugins/amcharts-charts-and-maps/ita.txt”);

});

function loadCSV(file) {
if (window.XMLHttpRequest) {
// IE7+, Firefox, Chrome, Opera, Safari
var request = new XMLHttpRequest();
} else {
// code for IE6, IE5
var request = new ActiveXObject(‘Microsoft.XMLHTTP’);
}

// load
request.open(‘GET’, file, false);
request.send();
parseCSV(request.responseText);
}

function parseCSV(data) {
//replace UNIX new lines
data = data.replace(/\r\n/g, “\n”);
//replace MAC new lines
data = data.replace(/\r/g, “\n”);
//split into rows
var rows = data.split(“\n”);

// loop through all rows

for (var i = 0; i < rows.length; i++) {
// this line helps to skip empty rows
if (rows[i]) {

// our columns are separated by comma
var column = rows[i].split(“,”);

// column is array now
// first item is date
var date = column[0];

var value = column[1];
var value1 = column[2];
var value2 = column[3];

// create object which contains all these items:
var dataObject = {
date: date,
malware: value,
threats: value1,
network: value2

};
// add object to chartData array
chartData.push(dataObject);
}
}
chart.validateData();
}

// this method is called when chart is first inited as we listen for “dataUpdated” event
function zoomChart() {
// different zoom methods can be used – zoomToIndexes, zoomToDates, zoomToCategoryValues
chart.zoomToIndexes(chartData.length – 50, chartData.length – 1);
}

// changes cursor mode from pan to select
function setPanSelect() {
if (document.getElementById(“rb1″).checked) {
chartCursor.pan = false;
chartCursor.zoomable = true;
} else {
chartCursor.pan = true;
}
chart.validateNow();
}

PREVIEW
The preview chart is displayed correctly.

WEB PAGE:
[amcharts id=”chart-1”]

When I insert the chart in the web page, it displays only the structure without data.