zui中的chart图表柱状图插件修改不了颜色？

图片描述

下面demo和官方的是一样的，为什么它有颜色，我的是灰色的？
代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>zui柱状图插件chart</title>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/zui.min.css">
    <link rel="stylesheet" type="text/css" href="zui.min.js">
    <script type="text/javascript" src="zui/dist/lib/chart/zui.chart.min.js"></script>
<style>
</style>
</head>
<body>
<canvas id="myBarChart" style="width:500px;" width="500px;"></canvas>
<script type="text/javascript">
var data = {
    labels: ["一月", "二月", "三月", "四月", "五月", "六月", "七月"],
    datasets: [
        {
            label: "蓝队",
            color: 'primary',
            data: [65, 59, 80, 81, 56, 55, 40]
        }, {
            label: "绿队",
            color: 'green',
            data: [28, 48, 40, 19, 86, 27, 90]
        }
    ]
};

var options = {responsive: true}; // 图表配置项，可以留空来使用默认的配置
var myBarChart = $('#myBarChart').barChart(data, options);
</script>
</body>
</html>

官方demo地址：
http://zui.sexy/#view/chart

chart zui

阅读 4.7k

2 个回答

得票最新

懒散的雪人

271

发布于
2017-05-26

✓ 已被采纳

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>zui柱状图插件chart</title>
    <link rel="stylesheet" type="text/css" href="http://zui.sexy/docs/css/zui.min.css">
    <script type="text/javascript" src="http://zui.sexy/assets/jquery.js"></script>
    <script type="text/javascript" src="http://zui.sexy/docs/js/zui.min.js"></script>
<style>
</style>
</head>
<body>
<canvas id="myBarChart" style="width:500px;" width="500px;"></canvas>
<script type="text/javascript">
var data = {
    labels: ["一月", "二月", "三月", "四月", "五月", "六月", "七月"],
    datasets: [
        {
            label: "蓝队",
            color: 'blue',
            data: [65, 59, 80, 81, 56, 55, 40]
        }, {
            label: "绿队",
            color: 'green',
            data: [28, 48, 40, 19, 86, 27, 90]
        }
    ]
};

var options = {responsive: true}; // 图表配置项，可以留空来使用默认的配置
var myBarChart = $('#myBarChart').barChart(data, options);
</script>
</body>
</html>

tuihou123321

49118112152

发布于
2017-05-26

更新于
2017-05-26

引入了老版本的zui.min.css,zui.min.js导致没有颜色
另外zui.min.js 应该写成src引入方式
还要再引入两个文件

    <link rel="stylesheet" type="text/css" href="css/colorset.css">
    <script type="text/javascript" src="zui/src/js/colorset.js"></script>

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进