chart
5 years ago in Plain Text
<!DOCTYPE html>
<html>
<head> <meta charset="UTF-8">
<link id='GoogleFontsLink' href='https://fonts.googleapis.com/css?family=Open Sans' rel='stylesheet' type='text/css'><link id='GoogleFontsLink' href='https://fonts.googleapis.com/css?family=Josefin Sans' rel='stylesheet' type='text/css'><link id='GoogleFontsLink' href='https://fonts.googleapis.com/css?family=Hammersmith One' rel='stylesheet' type='text/css'>
<script>
WebFontConfig = {
google:
{families: ["Open Sans","Josefin Sans","Hammersmith One",]},active: function() {
DrawTheChart(ChartData,ChartOptions,"chart-01","Pie")}
};
</script>
<script asyn src="https://livegap.com/charts/js/webfont.js">
</script><script src="https://livegap.com/charts/js/Chart.min.js"></script>
<script>
function DrawTheChart(ChartData,ChartOptions,ChartId,ChartType){
eval('var myLine = new Chart(document.getElementById(ChartId).getContext("2d")).'+ChartType+'(ChartData,ChartOptions);document.getElementById(ChartId).getContext("2d").stroke();')
}
</script>
</head>
<body>
<canvas id="chart-01" width="675" height="675" style="background-color:rgba(236,240,241,1);border-radius:0px;width:300px;height:300px;padding-left:0px;padding-right:0px;padding-top:0px;padding-bottom:0px"></canvas>
<script> function MoreChartOptions(){} var ChartData = [{value :27,
color:'rgba(24,161,152,0.92)',title:'Interested'},{value :9,color:'rgba(241,196,15,1)',title:'To be scheduled for interview'},{value :5,color:'rgba(231,76,60,1)',title:'Endorsed to Sherly'},{value :9,color:'rgba(142,68,173,1)',title:'To be contacted'},{value :2,color:'rgba(41,128,185,1)',title:'Reject'},{value :2,color:'rgba(30,161,59,1)',title:'WIthdrawn'},];ChartOptions= {totalAmplitude:90,decimalSeparator:".",thousandSeparator:",",spaceLeft:38,spaceRight:0,spaceTop:0,spaceBottom:35,scaleLabel:"<%=value+''%>",yAxisMinimumInterval:'none',scaleShowLabels:false,scaleShowLine:false,scaleLineStyle:"solid",scaleLineWidth:1,scaleLineColor:"rgba(0,0,0,0.6)",scaleOverlay :false,scaleOverride :false,scaleSteps:10,scaleStepWidth:10,scaleStartValue:0,inGraphDataShow:true,inGraphDataTmpl:'<%=v2%>',inGraphDataFontFamily:"'Josefin Sans'",inGraphDataFontStyle:"normal normal",inGraphDataFontColor:"rgba(41,41,41,1)",inGraphDataFontSize:15,inGraphDataPaddingX:0,inGraphDataPaddingY:0,inGraphDataAlign:"center",inGraphDataVAlign:"middle",inGraphDataXPosition:2,inGraphDataYPosition:3,inGraphDataAnglePosition:2,inGraphDataRadiusPosition:3,inGraphDataRotate:"inRadiusAxis",inGraphDataPaddingAngle:0,inGraphDataPaddingRadius:24, inGraphDataBorders:false,inGraphDataBordersXSpace:1,inGraphDataBordersYSpace:1,inGraphDataBordersWidth:1,inGraphDataBordersStyle:"solid",inGraphDataBordersColor:"rgba(0,0,0,1)",legend:true,maxLegendCols:1,legendBlockSize:20,legendFillColor:'rgba(8,8,8,0)',legendColorIndicatorStrokeWidth:1,legendPosX:1,legendPosY:3,legendXPadding:-31,legendYPadding:-36,legendBorders:false,legendBordersWidth:-1,legendBordersStyle:"dotted",legendBordersColors:"rgba(10,9,9,1)",legendBordersSpaceBefore:16,legendBordersSpaceLeft:14,legendBordersSpaceRight:11,legendBordersSpaceAfter:14,legendSpaceBeforeText:5,legendSpaceLeftText:5,legendSpaceRightText:5,legendSpaceAfterText:5,legendSpaceBetweenBoxAndText:22,legendSpaceBetweenTextHorizontal:12,legendSpaceBetweenTextVertical:14,legendFontFamily:"'Hammersmith One'",legendFontStyle:"normal normal",legendFontColor:"rgba(8,8,8,1)",legendFontSize:15,showYAxisMin:false,rotateLabels:"smart",xAxisBottom:true,yAxisLeft:true,yAxisRight:false,graphTitleSpaceBefore:-1,graphTitleSpaceAfter:-1, graphTitleBorders:false,graphTitleBordersXSpace:1,graphTitleBordersYSpace:1,graphTitleBordersWidth:1,graphTitleBordersStyle:"solid",graphTitleBordersColor:"rgba(0,0,0,1)",graphTitle : "Linkedin",graphTitleFontFamily:"'Hammersmith One'",graphTitleFontStyle:"normal normal",graphTitleFontColor:"rgba(44,62,80,1)",graphTitleFontSize:36,graphSubTitleSpaceBefore:2,graphSubTitleSpaceAfter:7, graphSubTitleBorders:false,graphSubTitleBordersXSpace:12,graphSubTitleBordersYSpace:13,graphSubTitleBordersWidth:1,graphSubTitleBordersStyle:"solid",graphSubTitleBordersColor:"rgba(0,0,0,1)",graphSubTitle : "Sourced Candidates 138",graphSubTitleFontFamily:"'Hammersmith One'",graphSubTitleFontStyle:"normal normal",graphSubTitleFontColor:"rgba(61,50,50,1)",graphSubTitleFontSize:18,scaleFontFamily:"'Open Sans'",scaleFontStyle:"normal normal",scaleFontColor:"rgba(0,0,0,1)",scaleFontSize:12,pointLabelFontFamily:"'Open Sans'",pointLabelFontStyle:"normal normal",pointLabelFontColor:"rgba(102,102,102,1)",pointLabelFontSize:12,angleShowLineOut:true,angleLineStyle:"solid",angleLineWidth:1,angleLineColor:"rgba(0,0,0,0.1)",percentageInnerCutout:80,scaleShowGridLines:true,scaleGridLineStyle:"solid",scaleGridLineWidth:1,scaleGridLineColor:"rgba(0,0,0,0.1)",scaleXGridLinesStep:1,scaleYGridLinesStep:3,segmentShowStroke:false,segmentStrokeStyle:"solid",segmentStrokeWidth:4,segmentStrokeColor:"rgba(255,255,255,1.00)",datasetStroke:true,datasetFill : true,datasetStrokeStyle:"solid",datasetStrokeWidth:2,bezierCurve:true,bezierCurveTension :0.4,pointDotStrokeStyle:"solid",pointDotStrokeWidth : 1,pointDotRadius : 3,pointDot : true,scaleTickSizeBottom:5,scaleTickSizeTop:5,scaleTickSizeLeft:5,scaleTickSizeRight:5,graphMin:0,barShowStroke : false,barBorderRadius:0,barStrokeStyle:"solid",barStrokeWidth:1,barValueSpacing:15,barDatasetSpacing:0,scaleShowLabelBackdrop :true,scaleBackdropColor:'rgba(255,255,255,0.75)',scaleBackdropPaddingX :2,scaleBackdropPaddingY :2,animation : true,onAnimationComplete : function(){MoreChartOptions()}};
DrawTheChart(ChartData,ChartOptions,"chart-01","Pie");</script></body></html>