Très simple tutoriel de D3.js pas de travail

Je suis un peu nouveau pour D3.js. Je suis en train de lire prise en main avec D3 par Mike Dewar. J'ai essayé le premier exemple, dans le livre, et ça ne fonctionne pas. J'ai déchiré mon entendre sur ce. Quel est le problème avec mon code ici?

Dans le <head> section:

<script src="http://mbostock.github.com/d3/d3.js"></script>
<script>
   function draw(data) {
    "use strict";
   d3.select("body")
      .append("ul")
      .selectAll("li")
      .data(data)
      .enter()
      .append("li")
         .text(function (d) {
            return d.name + ": " + d.status;
         });
      }
</script>

Dans le <body>:

<script>

    d3.json("flare.json", draw);

</script>

Et le fichier JSON:

[
{
    "status": ["GOOD SERVICE"],
    "name": ["123"],
    "url": [null],
    "text": ["..."],
    "plannedworkheadline": [null],
    "Time": [" 7:35AM"],
    "Date": ["12/15/2011"]
}
]
Essayez de modifier le script: <script src="</script" >d3js.org/d3.v3.min.js"></script>?
Non, toujours rien. Je pense que ce sont juste deux des Url vers les mêmes fichiers.

OriginalL'auteur | 2013-02-06

  1. 5

    Si vous utilisez google Chrome, il peut vous empêcher d'ouvrir le fichier correctement à cause de la croix domaine des restrictions de sécurité. Essayez avec Firefox pour voir si c'est le cas (il sera probablement vous permettre de charger le fichier correctement).

    Si c'est le problème, vous voulez installer un serveur web local comme WAMP (si vous êtes sous Windows) ou suivre les instructions sur la page du wiki ici: https://github.com/mbostock/d3/wiki

    Bonne chance

    Bizarre. Je pensais que j'avais déjà essayé, mais quand j'ai essayé de nouveau, il a travaillé. Merci!
    Cool! Bon d'obtenir un résultat!

    OriginalL'auteur d3noob

  2. 1

    Avez-vous vérifié votre navigateur de la console pour voir si votre demande XHR
    a été un succès?

    Lorsque je tente d'exécuter le code sur ma machine,
    avec une version locale de d3 (v3) dans visual studio 2012 Express,
    la demande XHR revient avec un message d'erreur:

    Erreur HTTP 404.3 - Pas Trouvé

    Cependant, lorsque je change l'extension de la "torche"
    fichier de .json à .txt ou .js, comme l'avait indiqué ici:
    https://serverfault.com/questions/39989/iis-cant-serve-certain-file-extension,
    ensuite, la demande XHR réussit.

    J'ai vérifié la console et le script ne renvoie que l'ouverture et la fermeture ul balises. J'ai essayé de changer l'extension du fichier, sans succès. Cependant, dans le passé, j'ai réussi à récupérer les données json en D3 à l'aide d'une fonction anonyme, en tant que tel d3.json("flare.json", function(error, root) {.... Je suis tout à fait confus.
    Merci pour cette. Oublié qu'IIS ne sert pas tout bizarre type de fichier de la boîte (c'est à dire .topojson).

    OriginalL'auteur mg1075

  3. 0

    Bien d.nom et d.le statut sont les deux tableaux et devrait être juste des chaînes si vous souhaitez afficher leur contenu ou de yo devraient accéder à l'indice 0 de la valeur de ces tableaux; I. e., d.nom[0] + ':' + d.[0];

    OriginalL'auteur elydelacruz

  4. 0

    Il pourrait être votre JSON. J'ai fait le même exercice, et il a bien fonctionné. Voici mon js(j'ai ajouté à une div, pas de corps). Je fais tourner un serveur web local.

    d3.json("data/mta001.json", drawli);

function drawli(data) {
    "use strict";
    d3.select('#mta001')
      .append('ul')
      .selectAll('ul')
      .data(data)
      .enter()
      .append('li')
        .text(function (d) {
            return d.name + ': ' + d.status;
      });
    d3.selectAll('#mta001 li')
      .style('color', function (d) {
        if ( d.status == 'GOOD SERVICE') {
            return 'green';
        } else {
            return 'fuchsia';
        }
      });
}

    et voici mon JSON:

    [
        {
          "name": "123",
          "status": "DELAYS",
          "text": "delay text",
          "Date": "12/08/2012",
          "Time": " 1:03PM"
        }
]

    OriginalL'auteur Ken Penn