superset0.34源码级别汉化

下载源码
git clone https://github.com/apache/incubator-superset.git

cd incubator-superset
切换到0.34版本
git checkout 0.34
进入js打包目录
cd superset/assets/
yarn install
yarn build
打包后的文件在superset/assets/dist目录
yarn dev   进行cheap-module-eval-source-map开发模式打包，可以看到代码来自哪个文件

修改superset/config.py
 修改默认语言中文，注释掉其他语言
# Setup default language
BABEL_DEFAULT_LOCALE = "zh"
# Your application default translation path
BABEL_DEFAULT_FOLDER = "superset/translations"
# The allowed translation for you app
LANGUAGES = {
    # "en": {"flag": "us", "name": "English"},
    # "it": {"flag": "it", "name": "Italian"},
    # "fr": {"flag": "fr", "name": "French"},
    "zh": {"flag": "cn", "name": "Chinese"},
    # "ja": {"flag": "jp", "name": "Japanese"},
    # "de": {"flag": "de", "name": "German"},
    # "pt": {"flag": "pt", "name": "Portuguese"},
    # "pt_BR": {"flag": "br", "name": "Brazilian Portuguese"},
    # "ru": {"flag": "ru", "name": "Russian"},
    # "ko": {"flag": "kr", "name": "Korean"},
}

排除源码和node_modules目录拷贝
需要源服务器和目标服务器都安装rsync（yum install -y rsync）
rsync -avP --exclude assets/node_modules/ --exclude assets/src/ superset root@192.168.81.142:/usr/local/lib/python3.6/site-packages/

进入superset目录编译语言包messages.po为messages.mo
pybabel compile -d translations

继续汉化
superset/translations/zh/LC_MESSAGES/messages.po增加

msgid "New"
msgstr "新增"

msgid "SQL Query"
msgstr "SQL 查询"

msgid "Refresh"
msgstr "刷新"

msgid "Filter List"
msgstr "筛选列表"

superset/templates/appbuilder/general/widgets/search.html
40行
Search&nbsp;&nbsp;<i class="fa fa-search"></i>
修改为
{{ _("Search") }}&nbsp;&nbsp;<i class="fa fa-search"></i>

57行
$('.filter-action > button').html('Refresh&nbsp;&nbsp;<i class="fa fa-refresh"></i>');
修改为
$('.filter-action > button').html({{_("Refresh")}}+'&nbsp;&nbsp;<i class="fa fa-refresh"></i>');

添加图表功能汉化
需要修改js，重新yarn build拷贝上去才行
src/addSlice/AddSliceContainer.jsx
自行修改英文
……各种文件各种改
注意message.json是作用于打包前的js源码的t('New')是获取message.json中New的对应中文
message.po是作用于python和template中的html的。

附压缩打包命令：
tar zcvf superset.tar.gz superset
tar zxvf superset.tar.gz

 

图表清单需要修改node包@superset-ui/chart……此种方式不行，名称是各个图表包里注册的，要逐个包改，而且包还在其他的git源中也有。
 git clone https://github.com/apache-superset/superset-ui.git
cd superset-ui
yarn install
yarn build

后来找到
src/explore/components/controls/VizTypeControl.jsx
修改这里
/增加对应中文名称
const chartMetadataCn={
  "Line Chart":"折线图",
"Big Number with Trendline":"有趋势线的大数字",
"Table":"表格",
"Filter Box":"过滤箱",
"Bar Chart":"条形图",
"Area Chart":"面积图",
"Time-series Bar Chart":"时间序列条形图",
"deck.gl Polygon":"deck.gl多边形",
"Pie Chart":"饼图",
"Time-series Table":"时间序列表",
"Pivot Table":"数据透视表",
"Histogram":"直方图",
"Big Number":"大数字",
"deck.gl Scatterplot":"deck.gl散点图",
"deck.gl 3D Hexagon":"deck.gl三维六边形",
"Time-series Period Pivot":"时间序列周期轴",
"deck.gl Arc":"desk.gl弧形",
"Heatmap":"热图",
"deck.gl Grid":"desk.gl网格",
"Dual Line Chart":"双线图",
"deck.gl Screen Grid":"deck.gl屏幕网格",
"Multiple Line Charts":"多折线图",
"Treemap":"矩阵树图",
"Box Plot":"方块图",
"Markup":"标记",
"Sunburst Chart":"太阳爆发图",
"Sankey Diagram":"桑基图",
"Word Cloud":"文字云",
"MapBox":"地图框",
"Calendar Heatmap":"日历热图",
"Nightingale Rose Chart":"夜莺玫瑰图",
"Bubble Chart":"气泡图",
"deck.gl Geojson":"deck.gl geojson文件",
"Horizon Chart":"地平线图",
"deck.gl Multiple Layers":"deck.gl多层",
"Time-series Percent Change":"时间序列百分比变化",
"Partition Chart":"分区图",
"Event Flow":"事件流",
"deck.gl Path":"deck.gl路径",
"Force-directed Graph":"力有向图",
"World Map":"世界地图",
"Paired t-test Table":"配对t检验表",
"Parallel Coordinates":"平行坐标",
"IFrame":"内嵌框架",
"Country Map":"国家地图",
"Bullet Chart":"项目符号图表",
"Chord Diagram":"和弦图",

};

///render里加一段代码
  render() {
    const { filter, showModal } = this.state;
    const { value } = this.props;

    const filterString = filter.toLowerCase();
    let filteredTypes = DEFAULT_ORDER
      .filter(type => registry.has(type))
      .map(type => ({
        key: type,
        value: registry.get(type),
      }))
      .concat(registry.entries().filter(({ key }) => !typesWithDefaultOrder.has(key)))
      .filter(entry => entry.value.name.toLowerCase().includes(filterString));

    for(var item in filteredTypes){
      const name= filteredTypes[item].value.name;
      // console.log(name);
      if(chartMetadataCn[name])
        filteredTypes[item].value.name=chartMetadataCn[name];
    }

 

/图表研究
----d3.js
d3_transitionPrototype.selectAll  方法内设置监听点。
找到src/chart/chartAction.js:215

再向上找到
src/chart/Chart.jsx:80

///汉化图表日期
从源码
node_modules/d3-time-format/locale/zh-CN.js
中拷贝出内容替换
node_modules/d3-time-format/src/defaultLocale.js
中的defaultLocale即可

替换后内容如下
defaultLocale({
  "dateTime": "%x %A %X",
  "date": "%Y年%-m月%-d日",
  "time": "%H:%M:%S",
  "periods": ["上午", "下午"],
  "days": ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
  "shortDays": ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
  "months": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
  "shortMonths": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"]
});
 

/页面标题title

title一般放在templates目录下，也有部分写死在js代码中（supserset/assets/src/*），需修改后重新编译。

 

/列表时间中文显示

列表时间采用python的humanize，汉化方式详见：humanize时间库使用及汉化

放好汉化包后，修改superset/models/helpers.py

    @property

    def changed_on_humanized(self):

        humanize.i18n.activate("zh_CN")

        return humanize.naturaltime(datetime.now() - self.changed_on)