score:27
Accepted answer
I think you cannot return values from the success call instead you would need to call a function instead. So set up your function that initializes your chart, and in the ajax success call that function with the data
With your code example
function visitorData (data) {
$('#chart1').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Average Visitors'
},
xAxis: {
categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']
},
yAxis: {
title: {
text: 'Number of visitors'
}
},
series: data,
});
}
$(document).ready(function() {
$.ajax({
url: '/visitdata',
type: 'GET',
async: true,
dataType: "json",
success: function (data) {
visitorData(data);
}
});
});
score:1
//parse json response
var chartSeriesData = [];
var chartCategory = [];
$.each(response, function() {
if(this.name!="TOTAL" && this.no!="0") {
var series_name = this.name;
var series_data = this.no;
var series = [
series_name,
parseFloat(series_data)
];
chartSeriesData.push(series);
}
});
//initialize options for highchart
var options = {
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'SalesOrder '
},
tooltip: {
pointFormat: '{series.name}: <b>{point.y}</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
center:['60%','60%'],
size:150
,
dataLabels: {
enabled: true,
color: '#000000',
distance: 40,
connectorColor: '#000000',
format: '<b>{point.name}</b>: {point.y} '
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data:chartSeriesData //load array created from json
}]
}
//options.series[0].setData(datavaluejson);
var chart= $('#container').highcharts(options);
score:2
In your ajax success function call your visitorData function with data[1].data (since that's how your json is formatted)
$.ajax({
url: '/visitdata',
type: 'GET',
async: true,
dataType: "json",
success: function (data) {
visitorData(data[1].data);
}
});
also, your visitorData function def is odd.
vistorData = function(data)
or
function vistorData(data)
Source: stackoverflow.com
Related Query
- creating highchart with ajax json data
- Plot Highchart Gauge with JSON Data
- HighChart Heatmap with JSON data
- Highcharts with ajax and json data what am i doing wrong?
- Highchart not displaying the pie chart with Ajax data
- JSON Data Map Issue with HighCharts + Ajax
- Have an issue with JavaScript, AJAX code displaying data
- Creating a Highchart with multiple series from a JSON file
- Updating Highchart Series Data with Formatted AJAX Return
- How to redraw highchart series with json data value?
- Issue with highchart data display when parsing JSON data
- HighChart with multple JSON api data
- Creating a pie highchart from Data in local (OBJECT) JSON file
- Highchart Not Updating With Returned Ajax Data Object
- data from AJAX json request not loading in HighChart
- highchart bar using json with series and xAxis data
- Highchart tooltip with json data
- Data parsing from mysql into highchart with json
- Creating highchart linechart with data using PHP (and Laravel)
- Reload chart data via JSON with Highcharts
- Load data into Highcharts with Ajax
- How to display highchart y axis with constistant data
- Highchart data series filled with different colors
- Highcharts with JSON data and multiple series
- Creating a line graph with highcharts and data in an external csv
- time data with irregular intervals in HighChart
- Highcharts - Global configuration with common code and unique data & Headings
- Highcharts load data with ajax to populate the tooltip
- Formatting JSON Data with ColdFusion for HighCharts
- Creating a Highchart for every data set
More Query from same tag
- Highcharts markers on line only where there are labels
- Highcharts - prevent large marker from overflowing axes - my bubbles are escaping =(
- How to create a stacked area chart with logarithmic (log) scale using Highcharts?
- highcharts scroll through axis
- Javascript parseFloat and nulls
- How do i combine a horizontal bar graph with a line chart?
- Is it possible to Customize highcharts drillup button
- How to hide grid line protrusion in bar chart
- Highcharts - columns too thin in differents zoom time
- I am getting error on highcharts. like "ERROR TypeError: Cannot read property 'series' of undefined"
- Highcharts drilldown to pie chart - Clicking on axis label with multiple series causes pie charts to overlap
- Escape c# class property from JSON serialization (to remove quotes)
- How to show a custom message box at last point, Highcharts
- Highcharts: Dynamic drilldown (stacked chart) in Combo Dual Axes
- Issue in drilldown of highcharts multiseries chart
- Json string without escape characters in highcharts
- Extending Area to full width of Chart with Months on x-axis
- Time setting for hour
- 3d High Charts Multiple Series inside of Drilldown
- How to bind dynamic data to highcharts in Windows Phone 8.1 application
- HighCharts: Is it possible to remove every other value on the x-axis?
- How to show more than one "dataMax" in Highcharts?
- Remove step line points
- Blank Highcharts div fixed by a reboot?
- How to create a chart with X and Y as strings?
- highcharts tooltip valueDecimals not working
- Disable legend hover in Highcharts
- add a bar Highcharts series
- Highchart xAxis label click jquery error
- Angular JSON from API to an Array of value