我正在尝试使用<canvas>
绘制徽章的图标,但是徽章在浏览器中根本没有显示。
在控制台中,我看到onload
已记录。
manifest.json
{
"name": "Extension",
"description": "Description",
"version": "0.0.1",
"background": {"scripts": ["backgroundScript.js"], "persistent": false},
"manifest_version": 2,
"icons": {
"64": "images/ico.png"
},
"options_ui": {
"page": "options.html",
"chrome_style": true
},
"browser_action": {
"default_title": "Extension",
"default_popup": "popup.html"
}
}
backgroundScript.js
var canvas = document.createElement('canvas');
var img = document.createElement('img');
img.onload = function () {
console.log('onload');
var context = canvas.getContext('2d');
context.drawImage(img, 0, 2);
context.fillStyle = 'rgba(255,0,0,1)';
context.fillRect(10, 0, 19, 19);
context.fillStyle = 'white';
context.font = '11px Arial';
context.fillText('3', 0, 19);
chrome.browserAction.setIcon({
imageData: context.getImageData(0, 0, 19, 19)
});
};
img.src = 'images/ico.png';
.
├── COPYING
├── README.md
└── addon
├── backgroundScript.js
├── images
│ └── ico.png
├── manifest.json
├── options.html
├── options.js
├── popup.html
└── style.css