Bar Chart

    
      var features = {"features": [...]};
      var chart1 = new Cedar({
        "type": "bar",
        "tooltip": {
          "title": "{Zip}",
          "content": "{Number_of_Students} students"
        },
        "dataset": {
          "data": features,
          "mappings": {
            "x": {"field":"Zip","label":"ZIP Code"},
            "y": {"field":"Number_of_Students","label":"Total Students"} } } });
      chart1.show({elementId: "#chart1", height: 300 });
    
  

Horizontal Chart

      
        var chart2 = new Cedar({
          "type": "bar-horizontal",
          "tooltip": {
            "title": "{Type}",
            "content": "{Number_of_Students} students"
          },
          "dataset": {
            "data": features,
            "mappings": {
              "x": {"field":"Number_of_Students","label":"Total Students"},
              "y": {"field":"Type","label":"Facility Use"}}}});
        chart2.show({elementId: "#chart2", height: 300});
      
    

Scatterplot

      
        var chart3 = new Cedar({
          "type": "scatter",
          "tooltip": {
            "title": "{Zip}",
            "content": "{Number_of} students"
          },
          "dataset": {
            "data": features,
            "mappings": {
              "x": {"field":"Number_of_Students","label":"Students"},
              "y": {"field":"Number_of_Teachers","label":"Teachers"},
              "color": {"field":"Type","label":"Total Students"}  } } });
        chart3.show({elementId: "#chart3", height: 300 });
      
    

Learn more...

Read the Tutorial for a walkthrough getting started with Cedar. See more Examples, learn the API, or check out the code on GitHub.