Data assigned to KendoUI chart must have keys that do not consist of numbers

When I input the following simple data into a KendoUI chart, the chart displays the data correctly.

var data = [
                {"state":"NY","abc":12312},
                {"state":"AZ","abc":12312},
                {"state":"CA","abc":12312},
                {"state":"VT","abc":12312}
            ];

It is important to note that the JSON provided above uses STRINGS for the keys.

However, when I use a number as a key, I encounter an "Unexpected number at line number 2156" error in kendo.all.js.

var data = [
                {"state":"NY","1":12312},
                {"state":"AZ","1":12312},
                {"state":"CA","1":12312},
                {"state":"VT","1":12312}
            ];

Any suggestions or assistance on this issue?

javascriptjsonkendo-ui

Answer №1

An issue related to Kendo's DataViz charts has been identified as a known design limitation. More information can be found here:

The crux of the matter is that the keys in the JSON document are utilized as variable names within the chart's code, necessitating them to adhere to valid JavaScript variable naming conventions.

Answer №2

There is a solution to this issue, although it may not be a permanent fix. One workaround is to manipulate the chart data using an array. For instance, in the scenario I encountered:

var arrData = new Array();
for (i = 0; i < data.d.length - 1; i++) {
    var tnt = new customData();
    tnt.displayField = data.d[i + 1][1].descriptionField.trim();

    for (var j = 1; j < data.d[0].length; j++) {
        var prop = 'a' +j.toString()
        var value = '';
        switch (displayName) {
            case 'DI_RESP':
                value = parseInt(data.d[i + 1][j].sampleField);
                tnt[prop] = value
                break;
            default:
                value = data.d[i + 1][j].sampleField;
                tnt[prop] = value;
                break;
        }
    }
    arrData.push(tnt);
}

In this setup, the customData model comprises descriptionField and sampleField properties. descriptionField signifies the category name while sampleField represents a floating point value. The addition of 'a' as a prefix concatenates it into a string format which can resolve the error.

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

I am unable to display my JSON data in Next.js using a fetch request

I'm having trouble understanding the code, and it seems like the API is open to anyone since it's just a simple JSON. However, I keep getting an error: Error Message: Reason: `undefined` cannot be serialized as JSON. Please use `null` or omit th ...

javascriptreactjsnext.js

Unclear reference to the term "subscript"

In my PHP script, I am retrieving data that has been encoded as JSON. Here is the code snippet: func getJson(completion: @escaping (Array<CarPark>) -> Void) { // Code to fetch and process JSON data } However, I encountered an erro ...

jsonswiftxcodesubscript

Can JSON-formatted JavaScript variables be inserted and utilized in MongoDB?

I am currently in the process of formatting a large JavaScript file so that I can insert it into a MongoDB collection and retrieve it using AJAX. However, I am encountering issues with the syntax. Here is an example snippet: var MyData = [ { Elements: ...

phpjavascriptjqueryjsonmongodb

GraphQL/Relay Schema "Field cannot be queried..."

I'm encountering an issue when trying to query specific fields in graphql/relay. My goal is to retrieve the "courseName" field for Courses from the schema provided below. For instance, if I query the User with: { user(id:1){firstname,lastname}} T ...

javascriptrelayjsgraphqlgraphql-js

Wrapping an anchor tag with a div in Codeigniter

Can a div tag be used inside an anchor function? I have a div with the following CSS: #first{ opacity:0; } Now, I want to include it in my anchor element. Here is the code snippet: <?php if(is_array($databuku)){ echo '<ol>&l ...

javascriptjqueryhtmlcsscodeigniter

When the mouse leaves, the background image will revert back to its original setting

https://i.stack.imgur.com/Ojd0Q.pngI need assistance in reverting a div's background image back to its default state using the onmouseleave method. Below is the HTML and JS code I have been working on: <script type="text/javascript"> functi ...

javascripthtmlcssimage-gallery

activating javascript function in rails when the page reloads

I have a rails4 app and I'm looking to implement some specific JavaScript events when the page loads, but only if the user is coming from a certain page. On the post#index page, all comment replies are initially hidden. When a user clicks on a specif ...

javascriptjqueryruby-on-rails

Successive promises of catches

Here is a situation that I am dealing with: controller.ts methodA(): void { myServive.someMethod() .then( () => console.log("then") ) .catch( e => { console.log("catch"); }); } service.ts someMethod(): ng: ...

javascriptangularjspromise

Populate an AngularJS select dropdown with JSON data and automatically pre-select the specified value

I am currently dealing with 2 entities: project and project_types. Each project can have one or multiple project_types associated with it. Using ajax (ng-init), I am retrieving the project data (including its related project_types) and all available proje ...

javascriptangularjsjson

Unable to retrieve any data from cURL response, continuous no value output received

What is my goal: My objective is to receive a response from a webserver and extract some data from it. I have successfully received the response from the webservice. The issue at hand: Although I am able to retrieve the data response from the server using ...

phpxmljsoncurlwsdl

How do you manage dependencies for nested components within Angular2?

Encountering an Issue: browser_adapter.js:76 Error: Cannot resolve all parameters for NestedComponent(undefined). Make sure they all have valid type or annotations. at NoAnnotationError.BaseException [as constructor] Diving Deeper Into the Problem: ...

javascripttypescriptangular

Using PLpgSQL, the program iterates through each record within a For Loop and then generates a

I am attempting to save a record or JSON data into an array and then return a JSON object from a function: CREATE OR REPLACE FUNCTION stat_per_day() RETURNS json AS $$ DECLARE RR RECORD; SS json[]; BEGIN FOR RR IN (SELECT DISTINCT date FROM time ...

arraysjsonpostgresqlplpgsql

Webpack attempts to duplicate files prior to compilation but I am anticipating the opposite outcome

I needed the copy plugin to run after compilation, which seemed like the logical order. However, I found myself having to compile using webpack twice every time in order to get the fresh version on production. It wasn't until later that I realized it ...

javascriptnode.jswebpack

Unusual situation involving the override of a function pointer variable

Let's explore a straightforward scenario: (function x(){ var foo = function(){ console.log('foo is alive!'); // set 'foo' variable to an empty function, using a delay setTimeout(function(){ foo = function(){}; ...

javascript

PHP failing to retrieve information

Having trouble with this specific file as it seems to be missing data in the address fields. Additionally, whenever "notes" are inputted, the Address data disappears. Any thoughts on how to resolve this issue? <tbody> ' ; $message .=&a ...

javascriptphpjquery

Issues with Django Site Search Functionality

Currently working on a Django project, I have encountered an issue with the search bar on my localhost site. Despite adding the search bar, it fails to return any results when provided input. Upon inspecting the page source, I discovered some unfamiliar li ...

javascriptpythonajaxdjangodjango-urls

Leveraging Angular 2 and RxJs 5 beta observables to continuously stream data from a while loop

I am looking to develop a straightforward Angular 2 application that calculates prime numbers within a while loop and continuously updates the view with newly discovered values. My goal is to showcase the list of prime numbers using *ngFor in real-time, gi ...

javascriptangularobservablerxjs

Using Typescript to assign a new class instance to an object property

Recently, I crafted a Class that defines the properties of an element: export class ElementProperties { constructor( public value: string, public adminConsentRequired: boolean, public displayString?: string, public desc ...

javascripttypescript

"Duplicate content issue with ng-transclude causing element to render twice

Why is the transcluded directive displaying Name inside directive = Frank twice? I believed I had a good grasp on transclusion, but this specific scenario has left me puzzled. Check out this fiddle for more details <div ng-app="myApp" ng-controller=" ...

javascriptangularjsangularjs-ng-transclude

Having trouble with JavaScript canvas drawImage function not functioning correctly

Having some trouble drawing part of an image properly. The width and height are not matching the original. Check out my code below: window.onload = function() { ImageObjSketch = new Image(); // URL ImageObjSketch.src = 'https://i.imgur.com/75lATF9 ...

javascripthtml5-canvasdrawimage