<svg viewBox='0 0 800 320' class='fm-chart'>
  <style type='text/css'>
  <![CDATA[
  .fm-chart text, .fm-tooltip {
    font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font: 10px sans-serif;
  }

  .fm-chart .axis .stroke {
    stroke: #aaa;
    stroke-width: 1px;
  }

  .fm-chart .axis .tick {
    stroke: #aaa;
    stroke-width: 1px;
  }

  .fm-chart .axis .label, .axis .title {
    fill: #666;
  }

  .fm-chart .axis .label {
    font-size: 10px;
  }

  .fm-chart .axis .title {
    font-size: 10px;
  }

  .fm-chart .chart-title {
    font-size: 12px;
    font-weight: bold;
  }

  .fm-chart .chart-subtitle {
    font-size: 10px;
  }

  .fm-chart text.label {
    fill: #666;
  }

  .fm-chart .legend text {
    font-size: 10px;
    fill: #333;
  }

  .fm-chart .legend text.title {
    fill: #666;
  }

  .fm-chart .line {
    fill: none;
    stroke: #000;
  }

  .fm-chart .area {
    opacity: 0.8;
  }

  .fm-chart .grid .gridline {
    stroke: #ddd;
    stroke-width: 0.02em;
  }

  .fm-chart .bar,
  .fm-chart .point,
  .fm-chart .area {
    fill: #000;
  }

  .fm-chart .bar.color6,
  .fm-chart .point.color6,
  .fm-chart .area.color6 {
    fill: #db843d;
  }

  .fm-chart .lines .line.color6 {
    strok: #db843d;
  }

  .fm-chart .bar.color5,
  .fm-chart .point.color5,
  .fm-chart .area.color5 {
    fill: #3d96ae;
  }

  .fm-chart .lines .line.color5 {
    stroke: #3d96ae;
  }

  .fm-chart .bar.color4,
  .fm-chart .point.color4,
  .fm-chart .area.color4 {
    fill: #80699b;
  }

  .fm-chart .line.color4 {
    stroke: #80699b;
  }

  .fm-chart .bar.color3,
  .fm-chart .point.color3,
  .fm-chart .area.color3 {
    fill: #89a54e;
  }

  .fm-chart .line.color3 {
    stroke: #89a54e;
  }

  .fm-chart .bar.color2,
  .fm-chart .point.color2,
  .fm-chart .area.color2 {
    fill: #aa4643;
  }

  .fm-chart .line.color2 {
    stroke: #aa4643;
  }

  .fm-chart .bar.color1,
  .fm-chart .point.color1,
  .fm-chart .area.color1 {
    fill: #4572a7;
  }

  .fm-chart .line.color1 {
    stroke: #4572a7;
  }

  .fm-chart.bar.vertical .axis.left .stroke,
  .fm-chart.bar.vertical .axis.left .tick,
  .fm-chart.bar.vertical .axis.right .stroke,
  .fm-chart.bar.vertical .axis.right .tick {
    display: none;
  }

  .fm-tooltip {
    text-align: center;
    padding: 5px 7px;
    color: #fff;
    background: #333;
    border-radius: 3px;
    font-size: 13px;
  }
  ]]>
  </style>
  <g class='axis bottom'>
    <text x='50.000000' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:56</text>
    <text x='153.571429' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:57</text>
    <text x='257.142857' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:57</text>
    <text x='360.714286' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:57</text>
    <text x='464.285714' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:58</text>
    <text x='567.857143' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:58</text>
    <text x='671.428571' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:59</text>
    <text x='775.000000' y='307.500000' style='text-anchor:middle; dominant-baseline:central;' class='label' >2015-07-28 03:59</text>
    <line x1='50.000000' y1='295.000000' x2='50.000000' y2='290.000000' class='tick' />
    <line x1='153.571429' y1='295.000000' x2='153.571429' y2='290.000000' class='tick' />
    <line x1='257.142857' y1='295.000000' x2='257.142857' y2='290.000000' class='tick' />
    <line x1='360.714286' y1='295.000000' x2='360.714286' y2='290.000000' class='tick' />
    <line x1='464.285714' y1='295.000000' x2='464.285714' y2='290.000000' class='tick' />
    <line x1='567.857143' y1='295.000000' x2='567.857143' y2='290.000000' class='tick' />
    <line x1='671.428571' y1='295.000000' x2='671.428571' y2='290.000000' class='tick' />
    <line x1='775.000000' y1='295.000000' x2='775.000000' y2='290.000000' class='tick' />
    <line x1='50.000000' y1='295.000000' x2='775.000000' y2='295.000000' class='stroke' />
  </g>
  <g class='axis left'>
    <text x='40.000000' y='295.000000' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <text x='40.000000' y='254.571429' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <text x='40.000000' y='214.142857' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <text x='40.000000' y='173.714286' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <text x='40.000000' y='133.285714' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <text x='40.000000' y='92.857143' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <text x='40.000000' y='52.428571' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <text x='40.000000' y='12.000000' style='text-anchor:end; dominant-baseline:middle;' class='label' >1.00</text>
    <line x1='50.000000' y1='295.000000' x2='55.000000' y2='295.000000' class='tick' />
    <line x1='50.000000' y1='254.571429' x2='55.000000' y2='254.571429' class='tick' />
    <line x1='50.000000' y1='214.142857' x2='55.000000' y2='214.142857' class='tick' />
    <line x1='50.000000' y1='173.714286' x2='55.000000' y2='173.714286' class='tick' />
    <line x1='50.000000' y1='133.285714' x2='55.000000' y2='133.285714' class='tick' />
    <line x1='50.000000' y1='92.857143' x2='55.000000' y2='92.857143' class='tick' />
    <line x1='50.000000' y1='52.428571' x2='55.000000' y2='52.428571' class='tick' />
    <line x1='50.000000' y1='12.000000' x2='55.000000' y2='12.000000' class='tick' />
    <line x1='50.000000' y1='12.000000' x2='50.000000' y2='295.000000' class='stroke' />
  </g>
  <g class='lines'>
    <circle cx='775.000000' cy='166.363636' r='0.000000' class='point color1' fm:label='2015-07-28 03:59:37: 1.0' fm:series='data', style=''></circle>
    <circle cx='651.323529' cy='166.363636' r='0.000000' class='point color1' fm:label='2015-07-28 03:59:08: 1.0' fm:series='data', style=''></circle>
    <circle cx='591.617647' cy='166.363636' r='0.000000' class='point color1' fm:label='2015-07-28 03:58:54: 1.0' fm:series='data', style=''></circle>
    <circle cx='139.558824' cy='166.363636' r='0.000000' class='point color1' fm:label='2015-07-28 03:57:08: 1.0' fm:series='data', style=''></circle>
    <circle cx='50.000000' cy='166.363636' r='0.000000' class='point color1' fm:label='2015-07-28 03:56:47: 1.0' fm:series='data', style=''></circle>
    <path stroke-width='2.000000' class='line color1' style='' d='M775.000000 166.363636 L651.323529 166.363636 L591.617647 166.363636 L139.558824 166.363636 L50.000000 166.363636 ' />
  </g>
</svg>
