%PDF- %PDF-
Direktori : /home/opti/workflow/src/public/app-assets/js/scripts/charts/d3/bar/ |
Current File : /home/opti/workflow/src/public/app-assets/js/scripts/charts/d3/bar/bar.min.js |
/*! * stack-admin-theme (https://pixinvent.com/bootstrap-admin-template/stack) * Copyright 2018 PIXINVENT * Licensed under the Themeforest Standard Licenses */ $(window).on("load",function(){function type(d){return d.frequency=+d.frequency,d}function resize(){width=ele.node().getBoundingClientRect().width-margin.left-margin.right,container.attr("width",width+margin.left+margin.right),svg.attr("width",width+margin.left+margin.right),x.rangeRoundBands([0,width],.1),svg.selectAll(".d3-xaxis").call(xAxis),svg.selectAll(".d3-bar").attr("x",function(d){return x(d.letter)}).attr("width",x.rangeBand())}var ele=d3.select("#bar-chart"),margin={top:20,right:20,bottom:30,left:50},width=ele.node().getBoundingClientRect().width-margin.left-margin.right,height=500-margin.top-margin.bottom,formatPercent=d3.format(".0%"),x=d3.scale.ordinal().rangeRoundBands([0,width],.1),y=d3.scale.linear().range([height,0]),xAxis=d3.svg.axis().scale(x).orient("bottom"),yAxis=d3.svg.axis().scale(y).orient("left").tickFormat(formatPercent),tip=d3.tip().attr("class","d3-tip").offset([-10,0]).html(function(d){return"<strong>Frequency:</strong> <span style='color:#FF847C'>"+d.frequency+"</span>"}),container=ele.append("svg"),svg=container.attr("width",width+margin.left+margin.right).attr("height",height+margin.top+margin.bottom).append("g").attr("transform","translate("+margin.left+","+margin.top+")");svg.call(tip),d3.tsv("../../../app-assets/data/d3/bar/bar.tsv",type,function(error,data){if(error)throw error;x.domain(data.map(function(d){return d.letter})),y.domain([0,d3.max(data,function(d){return d.frequency})]),svg.append("g").attr("class","d3-axis d3-xaxis").attr("transform","translate(0,"+height+")").call(xAxis),svg.append("g").attr("class","d3-axis d3-yaxis").call(yAxis).append("text").attr("transform","rotate(-90)").attr("y",6).attr("dy",".71em").style("text-anchor","end").style("fill","#1DE9B6").style("font-size",12).text("Frequency"),svg.selectAll(".d3-bar").data(data).enter().append("rect").attr("class","d3-bar").attr("x",function(d){return x(d.letter)}).attr("width",x.rangeBand()).attr("y",function(d){return y(d.frequency)}).attr("height",function(d){return height-y(d.frequency)}).on("mouseover",tip.show).on("mouseout",tip.hide).style("fill","#1DE9B6")}),$(window).on("resize",resize),$(".menu-toggle").on("click",resize)});