WD Data Adapter HTML Table 01 | samples | Documentation

HTMLcopy

 
<div id="container"></div>
<table id="htmlTable" class="htmlTable">
  <thead>
    <tr>
      <th>Date</th>
      <th>EUR</th>
      <th>USD</th>
      <th>YEN</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>01/01</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
    <tr>
      <td>01/02</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
    <tr>
      <td>01/03</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
    <tr>
      <td>01/04</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
    <tr>
      <td>01/05</td>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
  </tbody>
</table>

CSScopy

​x
 
* {
    margin: 0;
    padding: 0;
  }
​
html, body {
    height: 100%;
}
​
#container {
    width: 50%;
    height: 100%;
    float: left;
}
​
table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    float: left;
    max-width: 13%;
    margin: 10px 0 0 5px;
}
​
td, th {
    border: 1px solid #dddddd;
    text-align: center;
    padding: 8px;
}
​
tr:nth-child(even) {
    background-color: #dddddd;
}

JavaScriptAutocompletecopy

 
anychart.onDocumentReady(function () {
​
  // create a chart and set the data
  var chart = anychart.column();
  
  var tableData = anychart.data.parseHtmlTable("#htmlTable");
​
  chart.data(tableData);
​
  chart.legend(true);
​
  // set chart container and draw
  chart.container("container").draw();
});

Sample meta

AnyChart Documentation

Individual Legend Items (Legend)

Basic Settings (Legend)

Column Chart (Basic Charts)

Column Chart (Error Chart)

Column Chart (Polar Plot)

Data From JSON (Working with Data)

Data From XML (Working with Data)

Data Manipulation (Working with Data)

Data Sets (Working with Data)

Drawing (Drawing Tools and Annotations)

Pareto Chart (Basic Charts)

Range Column Chart (Basic Charts)

Series Manipulation (Working with Data)

Statistics (Common Settings)

Stick Chart (Error Chart)

Themes (Appearance Settings)