Home forums Using CanvasJS How can I get data out using my external Json file on a pie chart

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #28852
    javascript
    <code></code>

    window.onload = function () {

    let chart = new CanvasJS.Chart(“chartContainer”, {

    animationEnabled: true,
    title:{
    text: “Email Categories”,
    horizontalAlign: “left”
    },
    data: [{
    type: “doughnut”,
    startAngle: 60,
    //innerRadius: 60,
    indexLabelFontSize: 17,
    indexLabel: “{label} – #percent%”,
    toolTipContent: “<b>{label}:</b> {y} (#percent%)”,
    dataPoints: [
    { y: 67, label: “Inbox” },
    { y: 28, label: “Archives” },
    { y: 10, label: “Labels” },
    { y: 7, label: “Drafts”},
    { y: 15, label: “Trash”},
    { y: 6, label: “Spam”}
    ]
    }]
    });
    chart.render();

    }
    `
    JSON Data
    `
    [
    {
    “id”:1,
    “name”:”Lightwater Valley Theme Park”,
    “attractions”:34,
    “names”:[“Adventure Playground”, “Apollo”, “Carousel”, “Clownaround”, “Dragon Boats”, “Eagles Creek Farm”, “Human Cannonball”, “Jesters’ Jungle Fun”, “Jumpin’ Jacks”, “Jurassic Adventure Golf”, “Lady Bug”, “Lightwater Express Train”, “Mini Sand Diggers”, “Noah’s Ark”, “Outdoor Play”, “Pirate Swinger”, “Powder Kegs”, “Raptor Attack”, “Showbarn”, “Skull Rock”, “Sky Rider”, “Soft Play with Cafe”, “Space Pirates”, “Splash Falls”, “Swan Boats”, “The Black Pearl”, “The Eagle’s Claw”, “The Flying Cutlass”, “The Ladybird”, “The Little Dipper”, “The Ultimate”, “Thunderdome”, “Toddler Play”, “Trauma Tower”, “Vintage Car Rally”, “Wave Rider”, “Wild River Rapids”, “Young Fun”],
    “themes”:[“Rides”, “Family Fun”, “Children’s Play”],
    “address”:”Water Ln, North Stainley, Ripon, North Yorkshire, HG4 3HT”,
    “phone”: “01765635321”,
    “ticket”:[“Day Tickets”, “Annual Passes”, “School Trips”, “Group Tickets”],
    “food”:[“The Tasty Tucker Takeaway”, “Hungry Harbour”, “Cuppa Jo’s Coffee Shop”, “Eats ‘N’ Treats”, “Rollover Hot Dogs”, “Sweet Treats”, “The Munch Box”, “Eagle Bites”, “The Polar Krush Station”, “Walls Snack Bar”, “Soft Play Cafe”],
    “events”:[“Fab Feb Family Fun”, “Easter Days Out”, “Frightwater Valley”],

    “type”: “Feature”,
    “geometry”: {
    “type”: “Point”,
    “coordinates”: [54.17598, -1.57044]

    },
    “properties”: {
    “name”: “Lightwater-Valley”,
    “address”:”Water Ln, North Stainley, Ripon, North Yorkshire, HG4 3HT”,
    “description”:”Park Located here”
    }

    },
    ]
    `

    #28862

    @kushal,

    Please take a look at this documentation page for step by step tutorial on rendering a chart from an external JSON data.

    ___________
    Indranil Deo
    Team CanvasJS

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.