hellosean1025 / node-echarts

Generate chart by echarts in nodejs.
281 stars 88 forks source link

在linux下不能显示中文 #2

Closed siukimfong closed 6 years ago

siukimfong commented 7 years ago

在linux下,生成的图片的字体和大小无法改变,即使在Option里指定textStyle样式也不行。求解决方法

hellosean1025 commented 7 years ago

@siukimfong 请更新下node-echarts

中文无法显示是因为node-canvas库缺乏相应的字体,node-canvas某一分支提供了加入字体的api,下面是解决办法 1.git clone https://github.com/chearon/node-canvas.git ,然后进入到clone的项目目录,执行npm install

2.下载所需要的字体

3.具体代码如下:

var node_echarts = require('node-echarts'); var path = require('path'); var Canvas =require('./node-canvas'); Canvas.registerFont(path.join(__dirname, "华文仿宋.ttf"), { family: "华文仿宋"}); node_echarts({ canvas: Canvas, font: '12px 华文仿宋', path: __dirname + '/中文字体demo.png', option: option, width: 1000, height: 500 })

可查看demo下中文字体demo.js

siukimfong commented 7 years ago

感谢回复,新安装的canvas支持新的字体注册api了,但是node-echarts依然无法改变字体和字号。 我尝试只使用canvas来生成含有字符的图片,是成功的,一旦和echarts结合起来,就无法改变字体和字号了

huyangoo commented 7 years ago

@siukimfong 你好,请问我在安装node-echarts时总是报错,你有遇过么 以下是错误日志: gyp ERR! configure error gyp ERR! stack Error: gyp failed with exit code: 1 gyp ERR! stack at ChildProcess.onCpExit (/usr/local/node/0.10.24/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:337:16) gyp ERR! stack at ChildProcess.EventEmitter.emit (events.js:98:17) gyp ERR! stack at Process.ChildProcess._handle.onexit (child_process.js:789:12) gyp ERR! System Linux 2.6.32-431.el6.x86_64 gyp ERR! command "node" "/usr/local/node/0.10.24/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" gyp ERR! cwd /usr/local/node/0.10.24/lib/node_modules/node-echarts/node_modules/canvas gyp ERR! node -v v0.10.24 gyp ERR! node-gyp -v v0.12.1 gyp ERR! not ok npm ERR! canvas@1.6.5 install: node-gyp rebuild npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the canvas@1.6.5 install script. npm ERR! This is most likely a problem with the canvas package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! node-gyp rebuild npm ERR! You can get their info via: npm ERR! npm owner ls canvas npm ERR! There is likely additional logging output above.

npm ERR! System Linux 2.6.32-431.el6.x86_64 npm ERR! command "/usr/local/node/0.10.24/bin/node" "/usr/local/node/0.10.24/bin/npm" "install" "node-echarts" "-g" npm ERR! cwd /usr/local/bin npm ERR! node -v v0.10.24 npm ERR! npm -v 1.3.21 npm ERR! code ELIFECYCLE npm ERR! npm ERR! Additional logging details can be found in: npm ERR! /usr/local/bin/npm-debug.log npm ERR! not ok code 0

heimuya commented 7 years ago

@siukimfong maybe you can set the textStyle option in echarts options, such as:

textStyle: {
   fontFamily: '华文仿宋',
   fontSize: 12,
},
title: {
    text: '堆叠区域图'
},