原创

HQChart使用教程24-多语言设置

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/jones2000/article/details/98734091

效果图

英文版
Demo地址

支持的语言

目前支持 简体中文和英文

SetOption 设置语言

var option=
{
	Type:'历史K线图',
	......
	
	Language:'EN',  //英文 'EN' 中文:'CN'
    .........
}

Language 语言配置项 EN英文,CN中文

SetLanguage 动态设置语言

通过函数SetLanguage(language) 可以动态设置语言
language 设置的语言 EN英文,CN中文

chart.SetLanguage('EN');

多语言实现设计

所有的语言对应关系是保存在一个map表中, 在输出文字的时候,通过这个map表找到对应的语言的文字显示的画布上。
多语言文本查询类 JSChartLocalization.
后续如果需要增加其他语言,

  1. JSCHART_LANGUAGE_ID 在这个枚举中增加一个新的语言ID
  2. JSChartLocalization中的TextResource 增加对应的文字,并且在GetText()绑定对应关系
var JSCHART_LANGUAGE_ID=
{
    LANGUAGE_CHINESE_ID:0,
    LANGUAGE_ENGLISH_ID:1
};

function JSChartLocalization()
{
    this.TextResource=new Map([
        //内部tooltip
        ['Tooltip-Open', {CN:'开:', EN:'O:'}],
        ['Tooltip-High', {CN:'高:', EN:'H:'}],
        ['Tooltip-Low', {CN:'低:', EN:'L:'}],
        ['Tooltip-Close', {CN:'收:', EN:'C:'}],
        ['Tooltip-Increase', {CN:'幅:', EN:'I:'}],
        ['Tooltip-Vol', {CN:'量:', EN:'V:'}],
        ['Tooltip-Amount', {CN:'额:', EN:'A:'}],

        ['DivTooltip-Open', {CN:'开盘:', EN:'Open:'}],
        ['DivTooltip-High', {CN:'最高:', EN:'High:'}],
        ['DivTooltip-Low', {CN:'最低:', EN:'Low:'}],
        ['DivTooltip-Close', {CN:'收盘:', EN:'Close:'}],
        ['DivTooltip-Increase', {CN:'涨幅:', EN:'Increase:'}],
        ['DivTooltip-Vol', {CN:'数量:', EN:'Volume:'}],
        ['DivTooltip-Amount', {CN:'金额:', EN:'Amount:'}],

        //K线动态标题
        ['KTitle-Open', {CN:'开:', EN:'O:'}],
        ['KTitle-High', {CN:'高:', EN:'H:'}],
        ['KTitle-Low', {CN:'低:', EN:'L:'}],
        ['KTitle-Close', {CN:'收:', EN:'C:'}],
        ['KTitle-Increase', {CN:'幅:', EN:'I:'}],
        ['KTitle-Vol', {CN:'量:', EN:'V:'}],
        ['KTitle-Amount', {CN:'额:', EN:'A:'}],

        //走势图动态标题
        ['MTitle-Close', {CN:'价:', EN:'C:'}],
        ['MTitle-AvPrice', {CN:'均::', EN:'AC:'}],
        ['MTitle-Increase', {CN:'幅:', EN:'I:'}],
        ['MTitle-Vol', {CN:'量:', EN:'V:'}],
        ['MTitle-Amount', {CN:'额:', EN:'A:'}],

        //周期
        ['日线', {CN:'日线', EN:'1D'}],
        ['周线', {CN:'周线', EN:'1W'}],
        ['月线', {CN:'月线', EN:'1M'}],
        ['年线', {CN:'年线', EN:'1Y'}],
        ['1分', {CN:'1分', EN:'1Min'}],
        ['5分', {CN:'5分', EN:'5Min'}],
        ['15分', {CN:'15分', EN:'15Min'}],
        ['30分', {CN:'30', EN:'30Min'}],
        ['60分', {CN:'60分', EN:'60Min'}],

        //复权
        ['不复权', {CN:'不复权', EN:'No Right'}],
        ['前复权', {CN:'前复权', EN:'Pro Right'}],
        ['后复权', {CN:'后复权', EN:'Post Right'}],

        //week
        ['日', {CN:'日', EN:'Sun.'}],
        ['一', {CN:'一', EN:'Mon.'}],
        ['二', {CN:'二', EN:'Tues.'}],
        ['三', {CN:'三', EN:'Wed.'}],
        ['四', {CN:'四', EN:'Thur.'}],
        ['五', {CN:'五', EN:'Fri.'}],
        ['六', {CN:'六', EN:'Sat.'}],

        ['1月', {CN:'1月', EN:'Jan'}],
        ['2月', {CN:'2月', EN:'Feb'}],
        ['3月', {CN:'3月', EN:'Mar'}],
        ['4月', {CN:'4月', EN:'Apr'}],
        ['5月', {CN:'5月', EN:'May'}],
        ['6月', {CN:'6月', EN:'Jun'}],
        ['7月', {CN:'7月', EN:'Jul'}],
        ['8月', {CN:'8月', EN:'Aug'}],
        ['9月', {CN:'9月', EN:'Sept'}],
        ['10月', {CN:'10月', EN:'Oct'}],
        ['11月', {CN:'11月', EN:'Nov'}],
        ['12月', {CN:'13月', EN:'Dec'}]

    ]);

    this.GetText=function(key,language)
    {
        var item=this.TextResource.get(key);
        if (!item) return '';

        switch(language)
        {
            case JSCHART_LANGUAGE_ID.LANGUAGE_CHINESE_ID:
                return item.CN;
            case JSCHART_LANGUAGE_ID.LANGUAGE_ENGLISH_ID:
                return item.EN;
            default:
                return item.CN;
        }
    }

    this.SetTextResource=function(key,value)
    {
        this.TextResource.set(key,value)
    }
};

var g_JSChartLocalization=new JSChartLocalization();

如果还有问题可以加交流QQ群: 950092318

HQChart代码地址
地址:https://github.com/jones2000/HQChart

文章最后发布于: 2019-08-07 11:37:46
展开阅读全文
0 个人打赏

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 1024 设计师: 上身试试

分享到微信朋友圈

×

扫一扫,手机浏览