"Highcharts error code 13: Troubleshooting inconsistent x-axis data in JSON

After spending 10 hours attempting to display data from a SQL database using highgraph, I've managed to produce a JSON file with my data. However, I'm facing difficulties in integrating this data into highcharts.

I encountered an issue where Mozilla flagged mixed active content errors, prompting me to download additional scripts.

Upon trying to run my code, I received error 13. Here is the snippet of the code that caused the problem:

<!DOCTYPE HTML>
<html>
<head>
... (Scripts included)
</figure>
<script type="text/javascript">
$(document).ready(function() {
    var options = {
        chart: {
            type: 'spline'
        },
        title: {
            text: 'test'
        },
        ... (Other configuration settings)
    };
    
    $.getJSON("data.php", function(json) {
        options.series[0] = json[0];
        options.series[1] = json[1];
        chart = new Highcharts.Chart('container',options);  
    });
});
</script>

Any assistance would be greatly appreciated. Thank you!

Answer №1

To begin, make sure to structure your data into a series array containing both x and y values:

data: [ 
    // x, y
    [3, 4],
    [4, 6],
    [5, 10]
]

If needed, convert your data to match the requirements of Highcharts or create a valid JSON structure beforehand.

options.series.forEach(function(s){
    s.data = s.data.map((el, i) => [jsonData[0].data[i], el])
});

Check out this live demo: http://jsfiddle.net/BlackLabel/u8f0hs5g/

For more information, refer to the API Reference: https://api.highcharts.com/highcharts/series.line.data

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Convert the Include/require output to JSON encoding

I have a fully developed PHP application that was not created following the MVC design pattern and lacks a templating system like Twig. The issue I am facing is that instead of receiving a variable that stores the template (HTML output), it directly print ...

Issue with displaying dates correctly when retrieving data from an external CSV using Highcharts (Highstock)

I have been struggling for several days to integrate Highstock with an external CSV file. Initially, the problem was that the imported data was sorted in "descending" order while Highcharts required it to be sorted in "ascending" order. After discovering a ...

Explore within another map and analyze the node to spot the differences

I have some questions about iterating through a JavaScript Object and using array functions in JavaScript. Let's assume I have the following variables: var json1 = "[{"id": 1, "name":"x"}, {"id": 2, "name":"y"}]"; var json2 = "[{"id": 1, "name":"x"}, ...

Ways to split combined JSON data using jQuery?

I recently implemented a jQuery script that fetches data from a JSON server and stores it in an "output" variable. Here is how the code looks: $(function() { $.getJSON('http://127.0.0.1:8000/getData/', displayData); function displayData(da ...

Built-in Handlebars helper for nested iteration - no results displayed

I'm currently facing an issue with using an iteration helper within another one. Strangely, the inner helper isn't producing any output. Here's a snippet of the handlebars template I'm working with: {{#people}} <h4>{{firstNa ...

The system encountered an issue with converting org.json.JSONObject to JSONArray

I am having an issue with a PHP file in my Android project. When I try to display the array data from my PHP code, I encounter an error stating "error parsing data org.json.JSONException ... error org.json.JSONObject cannot be converted to JSONArray." Bel ...

Dynamic encoding/decoding operations

Utilizing Spring MVC and Jackson, I manage the API for an application. Here's my challenge - we need to serialize the Person class in two different ways: @Entity Order{ String id; String name; String address; List<Items> items; ...

Using jQuery to Populate a Table with JSON Data

Despite my extensive search and analysis of similar questions on this forum, I have reached a roadblock. My script is failing to load data from a Json file into the table I am trying to create, even after closely following the jquery API guidelines. Any as ...

Spring REST POST service is transmitting empty values for variables

I'm a beginner in Spring MVC and I've been working on exposing REST services. While my GET services are functioning properly, the issue arises when making a POST call from Postman as it sends empty null values for fields. Here's an example ...

Nested MongoDB object within multiple arrays

I need help with handling this JSON data structure: { data : { fields_data : [ [ { key1 : val }, { key1 : val } ], [ { key2 : val }, { key2 : val ...

Sending data from TextBox as json format

JavaScript Code: var latitude = document.getElementById("<%=txt_Lat.ClientID %>").value; var longitude = document.getElementById("<%=txt_Long.ClientID %>").value; var jsonData = {latitude: latitude, longitude: longitude}; var jsonString = JSO ...

Tips for utilizing JSON.parse

Within my ajax request, I am encountering the following code: 403: function(jqXHR) { var error = jqXHR.responseText; console.log(error); } When this error occurs, a message is displayed in the console: Htt ...

How to retrieve only the last value from a JSON object using jQuery's .html

I'm having an issue with jQuery("#someID").html. It seems to only display the last name from the JSON data. Here is the javascript code: <div class="row" id="fetchmember"> <script type="text/javascript"> jQuery('#group').cha ...

The function $.getJSON() seems to be non-responsive

I've been struggling to solve this issue for quite some time now. The users.json file that I am using can be found in the "JSON" folder alongside the other files. The alert("Before") is functioning properly, but I'm facing difficulty with getting ...

Is it possible to utilize a JavaScript variable in this particular scenario and if so, what is the

let myVariable = <?php echo json_encode($a[i want to insert the JS variable here]); ?>; Your prompt response would be highly valued. Many thanks in advance. ...

How to use the ObjC RestKit library for object mapping to a JSON NSString?

I'm currently utilizing RestKit on iOS. I've set up an object and its mapping, allowing me to communicate data with the server. Now, I'd like to have the -description method of my mapped objects return the JSON mapping for easier logging to ...

Can you provide me with instructions on utilizing the Apache HttpClient library for sending a PATCH request containing JSON data?

How can I use Apache HTTP client v 4.3.4 to send JSON data to a URL using the PATCH method? Here's what I've tried: // Create the httpclient HttpClient httpclient = HttpClientBuilder.create().build(); // Prepare a request object HttpUriRequest ...

Struggling to convert a JSON file into a TableView within a JavaScript application developed with Appcelerator

Trying to display a JSON file in a table using JavaScript and Appcelerator is proving to be quite a challenge. The output appears as an empty table when compiled to an example page. As someone relatively new to JavaScript and JSON, I'm seeking guidanc ...

Getting artist identification numbers from the API - classifying them as either long or int?

Hey there, I'm just starting out with programming so please bear with me as I try to figure things out! Currently, I'm working on retrieving artist IDs from a music website's API. I've included a snippet of my code below: JSONObject j ...

Retrieve the precise response parameter using urllib in Python

Is there a way to process the token information obtained from a web request using urllib in Python? from urllib import request from urllib.parse import urlencode response = request.urlopen(req, data=login_data) content = response.read() The response typic ...