Сомнения относительно того, являются ли данные JSON или объект JavaScript - PullRequest
0 голосов
/ 30 ноября 2018

Я новичок в программировании.Я изучал Stack Overflow и W3schools и сделал свой маленький проект только для обучения и совершенствования.

У меня есть вопрос, моя программа работает как надо, но проблема в том, что я не уверен (есть сомнения) это файл json, который я сделал настоящим json или JavaScript-объектом?

Кто-то говорит, что это так, а кто-то - нет, если это не настоящий json, как превратить его в настоящий json, потому что я не могу понять это.

У меня есть три группы в каждой группе по 4 человека, и эти люди одинаковы во всех 3 группах, но просто разные цифры (кредиты или голоса независимо от того, что у меня есть), и у меня есть файл json (я думаю, что это json)с именем 'values.json'.

Вот коды:

  <!DOCTYPE html>
    <html lang="en">

    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <script type="text/javascript" src="values.json"></script>
    <style>
    * {
        box-sizing: border-box;
    	   box-sizing: border-box;
       -webkit-box-sizing
       -moz-box-sizing: border-box;
    }

    .oee {
      float:left;
      height: 550px;
      width: 100%;
      display: inline-block;
    }

    .gauge {
      height: 250px;
      display: inline-block;
      width: 100%;
    }
     
    h1 { 
      float:left;  
    }

    body {   
      margin: 100px auto;  
      text-align: center; 
    }

    @media only screen and (orientation: landscape) {
    .gauge {
      width: 30%; 
    }

    .oee{width: 50%;
      margin-left: -132px;
    }
    }
      </style>
    </head>
    <body >
    <h1>people votes</h1>
     <div class="all">
         <div id="ww1" class="oee"></div>
        <div id="ww2" class="gauge" data-value=valuesparsed['Pekka']></div><br>
    	<div id="ww3" class="gauge"></div><br>
        <div id="ww4" class="gauge"></div>
      </div>    
      <script src="raphael-2.1.4.min.js"></script>
      <script src="justgage.js"></script>
      <script>
      document.addEventListener("DOMContentLoaded", function(event) {
        var valuesparsed = JSON.parse(values2)

        var dflt = {
          min: 0,
          max: 100,
       //   donut: true,
          gaugeWidthScale: 1.1,
          counter: true,
          hideInnerShadow: true
        }

        var ww1 = new JustGage({
          id: 'ww1',
          value: valuesparsed['Laura'],
          title: 'Laura ',
          defaults: dflt
        });

        var ww2 = new JustGage({
          id: 'ww2',
          title: 'Pekka',
          defaults: dflt
        });
    	
    	    var ww3 = new JustGage({
          id: 'ww3',
          value: valuesparsed['Jussi'],
          title: 'Jussi',
          defaults: dflt
        });
    	
    	    var ww4 = new JustGage({
          id: 'ww4',
          value: valuesparsed['Kalle'],
          title: 'Kalle',
          defaults: dflt
        });

      });
      
      </script>
    </body>
    </html>

values.json

    values1= '{"Laura" : 45, "Pekka" : 89, "Jussi" : 35, "Kalle" : 25}';
    values2= '{"Laura" : 75, "Pekka" : 59, "Jussi" : 85, "Kalle" : 95}';
    values3= '{"Laura" : 55, "Pekka" : 15, "Jussi" : 45, "Kalle" : 67}';

Ответы [ 4 ]

0 голосов
/ 01 декабря 2018

Файл, который вы называете values.json, это не JSON, а скрипт на языке JavaScript.Такой скрипт вы действительно можете включить и запустить с помощью тега script.

Если, однако, вы хотите иметь формат JSON для своих данных и хотите, чтобы он был загружен из файла в другой код JavaScript, выполните следующие действия:

  1. Поместите JSON в ваш файл (без имен переменных, без присвоений, без конечной точки с запятой, просто JSON) - это может быть только одна структура данных, поэтому давайте использовать массив:

    [{"Laura" : 45, "Pekka" : 89, "Jussi" : 35, "Kalle" : 25},
     {"Laura" : 75, "Pekka" : 59, "Jussi" : 85, "Kalle" : 95},
     {"Laura" : 55, "Pekka" : 15, "Jussi" : 45, "Kalle" : 67}]
    
  2. Удалите тег script src=.

  3. Отметьте функцию обратного вызова DOMContentLoaded как асинхронную:

    document.addEventListener("DOMContentLoaded", async function(event) {
    //                                            ^^^^^
    
  4. Добавьте код в этот обратный вызов для загрузки и анализа JSON в переменную arr:

    var response = await fetch("values.json");
    var arr = await response.json();
    var valuesparsed = arr[1]; // choose here which of the three you want to work with
    
    // Rest of your code comes here...
    
0 голосов
/ 30 ноября 2018

Содержимое values.json - это программа на JavaScript, которая назначает три строковых литерала трем глобальным переменным.

Значение каждой из этих строк представляет собой текст JSON.

Если вы хотите, чтобы просто JSON в этом файле, вам понадобится:

3 отдельных URL , каждый из которых содержит текст JSON, например:

{"Laura" : 45, "Pekka" : 89, "Jussi" : 35, "Kalle" : 25}

или 1 URL-адрес, содержащий массив объектов :

[
  {"Laura" : 45, "Pekka" : 89, "Jussi" : 35, "Kalle" : 25},
  {"Laura" : 75, "Pekka" : 59, "Jussi" : 85, "Kalle" : 95},
  {"Laura" : 55, "Pekka" : 15, "Jussi" : 45, "Kalle" : 67}
]

Тогда вам потребуется загрузить данные JSON, используя другой механизм(если JSON не JavaScript, вы не можете загрузить его с помощью <script>), например API выборки .

async function process_json() {

    const response = await fetch('your_json.json');
    const data = response.json();
    console.log(data);

}
0 голосов
/ 30 ноября 2018

Итак, @walee, просто чтобы подчеркнуть существующие ответы, я создал plunker для сортировки разницы между объектами JSON и JS .

В двух словах, я извлек ваши значения .json в реальный json: -

[
    {"Laura" : 45, "Pekka" : 89, "Jussi" : 35, "Kalle" : 25}
    ...
    ...
]

И Js:

const values1 = {"Laura": 45, "Pekka": 89, "Jussi": 35, "Kalle": 25},
    ...

В плунжере ,Я продемонстрировал получение файла json с помощью Fetch API , но можно использовать любую библиотеку HTTP там.

0 голосов
/ 30 ноября 2018

Ваше значение. Json

values1= '{"Laura" : 45, "Pekka" : 89, "Jussi" : 35, "Kalle" : 25}';
values2= '{"Laura" : 75, "Pekka" : 59, "Jussi" : 85, "Kalle" : 95}';
values3= '{"Laura" : 55, "Pekka" : 15, "Jussi" : 45, "Kalle" : 67}';

на самом деле не является JSON.

JSON начинается с

{

Объект.

или

[

Массив.

и заканчивается тем же самым в зависимости от их начала.

Примером будет

{"Laura" : 45, "Pekka" : 89, "Jussi" : 35, "Kalle" : 25}

В вашем сценарии выхотел бы иметь массив JSON, который будет содержать ваши объекты, что-то вроде этого:

[{
        "Laura": 45,
        "Pekka": 89,
        "Jussi": 35,
        "Kalle": 25
    },
    {
        "Laura": 75,
        "Pekka": 59,
        "Jussi": 85,
        "Kalle": 95
    },
    {
        "Laura": 55,
        "Pekka": 15,
        "Jussi": 45,
        "Kalle": 67
    }
]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...