小编kds*_*kii的帖子

Chartjs v2中风阴影

我想在线图上使用一个笔触.但是我找到的每个解决方案都只适用于chartjs v1.

他们的最新解决方案是什么?

多数民众赞成我用chartjs v1设计的,但就像我说的那样,我发现无法用版本2做到这一点.

的jsfiddle

Chart.types.Line.extend({
  name: "LineAlt",
  initialize: function () {
    Chart.types.Line.prototype.initialize.apply(this, arguments);

    var ctx = this.chart.ctx;
    var originalStroke = ctx.stroke;
    ctx.stroke = function () {
      ctx.save();
      ctx.shadowColor = '#E56590';
      ctx.shadowBlur = 10;
      ctx.shadowOffsetX = 0;
      ctx.shadowOffsetY = 4;
      originalStroke.apply(this, arguments)
      ctx.restore();
    }
  }
});

var data = {
  labels: ["January", "February", "March", "April", "May", "June", "July"],
  datasets: [
    {
      label: "My First dataset",
      fillColor: "#fff",
      strokeColor: "#ffb88c",
      pointColor: "#fff",
      pointStrokeColor: "#ffb88c",
      pointHighlightFill: "#ffb88c",
      pointHighlightStroke: "#fff",
      data: [65, …
Run Code Online (Sandbox Code Playgroud)

html javascript chart.js

7
推荐指数
1
解决办法
4470
查看次数

如何修复侧边栏底部的最后一个div容器

我构建了一个基本的侧边栏,里面有一个导航列表。我正在尝试的是获取.sidebar-footer侧边栏底部的最后一个 div 容器。当我给类一个绝对位置时,它覆盖在列表项上,我应该怎么做才能让它像我们的设计图片中那样? 演示图片

<div class="pulse-menu">
    <div class="menu-bg clearfix">
        <div class="sidebar-profile">
            <img src="img/users/avatar.jpg" class="sidebar-img" alt="Candice Swanepoel" title="Candice Swanepoel" />
            <h5>Candice Swanepoel</h5>
        </div>
    </div>
    <nav>
        <ul>
            <li><a href="#">Dashboard</a></li>
            <li><a href="#">Models</a></li>
            <li><a href="#">Kunden</a></li>
            <li><a href="#">Finanzen</a></li>
            <li><a href="#">Mitarbeiter</a></li>
            <li><a href="#">Einstellung</a></li>
        </ul>
        <div class="sidebar-footer">
            <li><a href="#"><i class="icon-cloud-upload circle-icon">        </i></a></li>
        </div>
    </nav>

</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

.pulse-menu {
  background-color: #fafafa;
  width: 19.286em;
  position: fixed;
  z-index: 1050;
  top: 0;
  bottom: 0;
  height: 100%;
  text-transform: uppercase;
  overflow-y: scroll;
}

.menu-bg {
  width: 270px;
  height: 230px;
  background: url(../img/media/menu_bg.svg) ; …
Run Code Online (Sandbox Code Playgroud)

html css

5
推荐指数
1
解决办法
7258
查看次数

没有填充容器内的Highchart

是否有可能没有左右填充的折线图?这条线是边缘到边缘,就像在设计中一样?

预习

目前它看起来像那样

演示

chartOptions: {
chart: {
  type: 'spline',
  spacingBottom: 0,
},
title: null,
legend: {
  enabled: false
},
credits: {
  enabled: false,
},
tooltip: {
  split: true,
  pointFormat: '{point.y} {series.name}',
},
plotOptions: {
  series: {
    shadow: true,
  },
},
xAxis: {
  categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
  minPadding: 0,
  maxPadding: 0,
  tickWidth: 0,
  lineWidth: 0,
  crosshair: true,
},
yAxis: {
  visible: false,
},
series: [
  {
    name: 'Bookings',
    data: [43, 44, 43, 42, …
Run Code Online (Sandbox Code Playgroud)

html javascript css charts highcharts

-1
推荐指数
1
解决办法
336
查看次数

标签 统计

html ×3

css ×2

javascript ×2

chart.js ×1

charts ×1

highcharts ×1