codn/adminpanel

View on GitHub
app/assets/javascripts/adminpanel/google_analytics_chart.js.coffee

Summary

Maintainability
Test Coverage
$(document).on 'turbolinks:load', ->
  if $('#google-stats').length
    margin =
      top: 20
      right: 20
      bottom: 20
      left: 30

    width = $('.widget-body').width() - margin.left - margin.right
    height = 450 - margin.top - margin.bottom

    data = $('.widget-body').data 'visits'

    x = d3.time.scale()
      .domain [new Date(data[0].date), new Date(data[data.length - 1].date) ]
      .range [0, width]

    y = d3.scale.linear()
      .domain(d3.extent(data, (d) -> +d.visits))
      .range([height, 0])

    xAxis = d3.svg.axis()
      .scale x
      .orient "bottom"

    yAxis = d3.svg.axis()
      .scale y
      .orient "left"

    line = d3.svg.line()
      .x (d) -> x new Date d.date
      .y (d) -> y d.visits

    chart = d3.select "#chart"
      .attr "width", width + margin.left + margin.right
      .attr "height", height + margin.top + margin.bottom
      .append "g"
        .attr "transform", "translate(#{margin.left}, #{margin.top})"


    chart.append "g"
      .attr "class", "x axis"
      .attr "transform", "translate(0, #{height})"
      .call xAxis

    chart.append "g"
      .attr "class", "y axis"
      .call yAxis
    .append "text"
      .attr "transform", "rotate(-90)"
      .attr "y", 6
      .attr "dy", ".71em"
      .style "text-anchor", "end"
      .text "Visitas"

    chart.append "path"
      .datum data
      .attr "class", "line"
      .attr "d", line