#javascript #json #d3.js
#javascript #json #d3.js
Вопрос:
Я пытаюсь заполнить этот график (см. URL ниже) своими собственными данными JSON. http://bl.ocks.org/phuonghuynh/54a2f97950feadb45b07
Я новичок в JS и D3. Я написал некоторый код в файле под названием parse.js для этого нужен файл.json и возвращает массив объектов, каждый объект имеет имя исполнителя и его частоту.
const data = require("./file.json");
Object.size = function(obj) {
var size = 0, key;
for (key in obj) {
if (obj.hasOwnProperty(key)) size ;
}
return size;
};
var size = Object.size(data);
var artists = [];
var Artfreq = function(artist, frequency)
{
this.artist = artist;
this.frequency = frequency;
};
for(var i = 0; i < size; i )
{
var k = 0;
if(artists.length == 0)
{
var newArtist = new Artfreq(data[i].artistName, 1);
artists.push(newArtist);
}
else
{
for(var j = 0; j < artists.length; j )
{
if(data[i].artistName == artists[j].artist)
{
artists[j].frequency = 1;
k = 1;
}
}
if(k != 1)
{
var newArtist = new Artfreq(data[i].artistName, 1);
artists.push(newArtist);
}
}
}
console.log(artists);
Я проверил, что приведенный выше код работает так, как я ожидаю, с этой консолью.инструкция журнала.
Я загрузил index.js и index.html код по ссылке выше. Я не могу понять, как заменить data.item моим массивом artist.
data: {
items: [
{text: "Java", count: "236"},
{text: ".Net", count: "382"},
{text: "Php", count: "170"},
{text: "Ruby", count: "123"},
{text: "D", count: "12"},
{text: "Python", count: "170"},
{text: "C/C ", count: "382"},
{text: "Pascal", count: "10"},
{text: "Something", count: "170"},
],
eval: function (item) {return item.count;},
classed: function (item) {return item.text.split(" ").join("");}
},
Я попытался экспортировать / импортировать массив artists из parse.js файл, который создает массив исполнителей для index.js досье. Я пробовал копировать и вставлять (с небольшими изменениями) в код из моего parse.js файл в index.js досье. Я столкнулся с несколькими ошибками, включая политику перекрестного происхождения, синтаксические проблемы с экспортом / импортом и т.д. Я прогуглил отдельные ошибки, которые заставили меня делать такие вещи, как добавить type = «module» в index.html досье. К сожалению, я оказываюсь в цикле, где исправление одной ошибки вызывает другую.
Я знаю, что в конечном итоге мне нужно будет ввести данные объекта, чтобы «текст» отображался на «Имя исполнителя», а «количество» соответствовало «частоте». Однако я даже не могу импортировать свои данные в это index.js досье.
Был бы очень признателен за помощь. Спасибо!
Комментарии:
1. Я бы изучил чтение исходного файла JSON с помощью
d3.json
. Вам нужно будет разместить файл где-нибудь на веб-сервере, но это наиболее распространенный способ d3 для этого2. Спасибо за ваш ответ! Я изучу это.