【问题标题】:Can't change color on an image drawing canvas无法在图像绘图画布上更改颜色
【发布时间】:2018-12-10 06:54:54
【问题描述】:

我创建了一个图像绘图画布,但绘图颜色无法更改。也许它是javascript设置颜色但找不到。如果有人知道请帮助我。这是演示链接

http://affibe.com/erevo/

HTML 代码: `

<html class="gr__adsterra_com">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="js/jquery-2.2.4.min.js"></script> 
<script type="text/javascript" src="js/pixi.min.js"></script> 
<script type="text/javascript" src="js/animationFrame.js"></script> 
<script type="text/javascript" src="js/nodes.js"></script>
<style>body{margin: 0; background-color: transparent;}</style>
</head>
<body data-gr-c-s-loaded="true">
    <header> 
    <script>lowPerformance=function (){var ua=navigator.userAgent.toLowerCase(); if (ua.indexOf("iphone") !=-1 || ua.indexOf("mobile") !=-1) return true; if ($(window).width()==0) return; return ($(window).width() <=480) ? true : false;}; var ie=false; var w=window, d=document, documentElement=d.documentElement, body=d.getElementsByTagName('body')[0], height=w.innerHeight|| documentElement.clientHeight|| body.clientHeight; if (navigator.appName=='Microsoft Internet Explorer') ie=true; Nodes.multipleInit([{"post_name": "AFFIBE", "drawnImage": (height>860)?"http:\/\/affibe.com\/erevo\/images\/main\/logo_header_er.png":"http:\/\/affibe.com\/erevo\/images\/main\/logo_header_er.png", "linkTitle": "AFFIBE", "particleDensity": ie?"11":"7", "particleWidth": "0.5", "particleHeight": "0.5"}]); </script>
    </header>
</body>
</html>

pixi.min.js: http://affibe.com/erevo/js/pixi.min.js

animationFrame.js

!function(){for(var n=0,i=["ms","moz","webkit","o"],e=0;e<i.length&&!window.requestAnimationFrame;++e)window.requestAnimationFrame=window[i[e]+"RequestAnimationFrame"],window.cancelAnimationFrame=window[i[e]+"CancelAnimationFrame"]||window[i[e]+"CancelRequestAnimationFrame"];window.requestAnimationFrame||(window.requestAnimationFrame=function(i){var e=(new Date).getTime(),a=Math.max(0,16-(e-n)),o=window.setTimeout(function(){i(e+a)},a);return n=e+a,o}),window.cancelAnimationFrame||(window.cancelAnimationFrame=function(n){clearTimeout(n)})}();

【问题讨论】:

  • 请直接在问题中提供您的代码,而不是作为其他地方的链接。
  • 我上传了完整的代码请帮帮我

标签: javascript jquery css canvas html5-canvas


【解决方案1】:

如果我理解了,下面的代码对你有帮助

var c = document.getElementById("canvas");
var ctx= c.getContext("2d");
ctx.fillStyle="#66bfff";

例如

var c   = document.getElementById('canvas');
var ctx = c.getContext("2d");
ctx.fillStyle = "#f00";
ctx.fillRect(40, 40, 40, 40);
#canvas{
    border: 2px solid #333;
}
<html>
<body>
    <canvas id="canvas" width="100" height="100"></canvas>
</body>
</html>

【讨论】:

  • 我放了这段代码,但没有工作我在 pixi.min.js 上看到了这个 i.fillStyle="#f00":prntscr.com/k1vzr2 更改此颜色但不更改颜色?
  • 我 sn-p 代码请运行 code sn-p 如果没有,所以我不明白你的目的
猜你喜欢
  • 2018-01-24
  • 2014-08-15
  • 2012-12-19
  • 1970-01-01
  • 2023-03-11
  • 1970-01-01
  • 1970-01-01
  • 2016-01-13
  • 1970-01-01
相关资源
最近更新 更多