roughViz实现手绘风格曲线图饼状图柱形图散点图代码-html代码-BFW代码库

roughViz实现手绘风格曲线图饼状图柱形图散点图代码

代码语言：html

所属分类：图表

代码描述：roughViz实现手绘风格曲线图饼状图柱形图散点图代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/roughViz.js"></script>
    <style>
        body{overflow-x:hidden}h1{text-align:center;margin-top:150px}h2{text-align:center}
    </style>
</head>

<body>
    <h1>roughViz</h1>
    <div id="column"></div>
    <script>
        new roughViz.Bar({element:'#column',data:{labels:['1992 Ford Aerostar Van','2013 Kia Rio','1980 Honda CB 125s','1992 Toyota Tercel'],values:[8,4,6,2]},title:'Letters',labels:'letter',width:window.innerWidth,values:'frequency',stroke:'coral',strokeWidth:3,color:'pink',fillWeight:1.5,});
    </script>
    <div id="bar"></div>
    <script>
        new roughViz.BarH({element:'#bar',title:"Vehicles I've Had",titleFontSize:'1.5rem',legend:false,margin:{top:50,bottom:100,left:160,right:0},data:{labels:['1992 Ford Aerostar Van','2013 Kia Rio','1980 Honda CB 125s','1992 Toyota Tercel'],values:[8,4,6,2]},width:window.innerWidth,xLabel:'Time Owned (Years)',strokeWidth:2,fillStyle:'zigzag-line',highlight:'gold',});
    </script>
    <div id="donut"></div>
    <script>
        new roughViz.Donut({element:'#donut',legend:false,data:{labels:['JNCO Jeans','Sweat Pants','Jorts'],values:[20,10,2]},title:'Pants I Got Clowned On For Wearing In High School',titleFontSize:'2rem',labels:'letter',values:'frequency',width:window.innerWidth,s.........完整代码请登录后点击上方下载按钮下载查看