Incubator-superset: superset 0.28.1 integrated echarts method

[mildrabbit]

I want to integrate echarts into superset 0.28.1. How to use it

[Llyfighting]

You should install superset first，there are many related tutorials on the internet，you can learn from them. I'm doing the same thing now, and I have an unsolvable problem, Maybe we can talk to each other.

[mildrabbit]

@Llyfighting Thanks！ I have set up the development environment, also according to some of the information on the Internet to configure, but also encountered problems, has not been solved.

[Llyfighting]

An error occurred while rendering the visualization: TypeError: (0 , o.getColorFromScheme) is not a function

Have you ever had this problem?

[mildrabbit]

@Llyfighting no

[mildrabbit]

@Llyfighting 看了你的贴子，受益非浅，怎么联系你，有事请教

[EmiyaSaber]

你这个问题解决了吗？我在Windows下使用pip安装superset之后有好多博客当中的文件都找不到。很困扰

[mildrabbit]

不要在windows里装superset....

------------------ 原始邮件 ------------------
发件人: "EmiyaSaber"[e-mail];
发送时间: 2019年4月18日(星期四) 下午5:06
收件人: "apache/incubator-superset"[e-mail];
抄送: "沐曦--刘志国"[e-mail]; "Author"[e-mail];
主题: Re: [apache/incubator-superset] superset 0.28.1 integrated echartsmethod (#6883)

你这个问题解决了吗？我在Windows下使用pip安装superset之后有好多博客当中的文件都找不到。很困扰

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub, or mute the thread.

[EmiyaSaber]

那在什么环境下装比较好

在 2019-04-18 17:08:37，"mildrabbit" [e-mail] 写道：
不要在windows里装superset....

------------------ 原始邮件 ------------------
发件人: "EmiyaSaber"[e-mail];
发送时间: 2019年4月18日(星期四) 下午5:06
收件人: "apache/incubator-superset"[e-mail];
抄送: "沐曦--刘志国"[e-mail]; "Author"[e-mail];
主题: Re: [apache/incubator-superset] superset 0.28.1 integrated echartsmethod (#6883)

你这个问题解决了吗？我在Windows下使用pip安装superset之后有好多博客当中的文件都找不到。很困扰

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub, or mute the thread.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.

[mildrabbit]

我们是在centos上安装的。

------------------ 原始邮件 ------------------
发件人: "EmiyaSaber"[e-mail];
发送时间: 2019年4月18日(星期四) 下午5:13
收件人: "apache/incubator-superset"[e-mail];
抄送: "沐曦--刘志国"[e-mail]; "Author"[e-mail];
主题: Re: [apache/incubator-superset] superset 0.28.1 integrated echartsmethod (#6883)

那在什么环境下装比较好

在 2019-04-18 17:08:37，"mildrabbit" [e-mail] 写道：
不要在windows里装superset....

------------------ 原始邮件 ------------------
发件人: "EmiyaSaber"[e-mail];
发送时间: 2019年4月18日(星期四) 下午5:06
收件人: "apache/incubator-superset"[e-mail];
抄送: "沐曦--刘志国"[e-mail]; "Author"[e-mail];
主题: Re: [apache/incubator-superset] superset 0.28.1 integrated echartsmethod (#6883)

你这个问题解决了吗？我在Windows下使用pip安装superset之后有好多博客当中的文件都找不到。很困扰

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub, or mute the thread.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub, or mute the thread.

[gbrian]

Hi, Do you still working on this @mildrabbit @Llyfighting ?

[mistercrunch]

echarts looks pretty neat, I'd love to see integrations with Superset.

[gbrian]

@mistercrunch hold my beer! 🤣

[hamza-iqbal-hi]

Any news?

[gbrian]

WIP but slooow dut to fixing bugs. @mistercrunch is this the new way to go: @superset-ui/plugin-*? https://github.com/apache-superset/superset-ui-plugins

Found open question for echarts: https://github.com/apache-superset/superset-ui-plugins/issues/76

[mistercrunch]

Yes @gbrian, that's the way to go. The whole npm link thing works but isn't ideal. There must be an easy way to work on the plugin locally in the main repo and port it once it's baked. @kristw said he's wrapping up some things around controls before documenting the process of adding a new viz.

[hamza-iqbal-hi]

@mistercrunch when will we be able to see echarts in superset, or a documentation for adding a new viz?

[EmiyaSaber]

I have already add some simple Echarts viz to superset, and it get worked. I worked on windows with python and JS. And we need npm to manage the JS file from superset.Everytime we change the JS file from superset , we need to run' npm run dev '.

[thunter009]

@EmiyaSaber mind providing a link to a fork with the working echarts integration you mention? Would love to try testing it out on a private fork I maintain.

[gbrian]

Hi,

Have an intermediate step while developing the final Chart plugin. Is about using a modified version of the Markup visualization. It requieres just few changes on Superset (no need to deal with plugins repo currently).
_Not a final solution but helps in the meantime 😄_

Changes are:

• Add Jinja2 templates
• Add Query and data functionalities

CODE:

class MarkupViz(BaseViz):

    """Use html or markdown to create a free form widget"""

    viz_type = "markup"
    verbose_name = _("Markup")
    is_timeseries = False

    def should_be_timeseries(self):
        fd = self.form_data
        # TODO handle datasource-type-specific code in datasource
        conditions_met = (fd.get("granularity") and fd.get("granularity") != "all") or (
            fd.get("granularity_sqla") and fd.get("time_grain_sqla")
        )
        if fd.get("include_time") and not conditions_met:
            raise Exception(
                _("Pick a granularity in the Time section or " "uncheck 'Include Time'")
            )
        return fd.get("include_time")

    def query_obj(self):
        d = super().query_obj()
        fd = self.form_data

        if fd.get("all_columns") and (fd.get("groupby") or fd.get("metrics")):
            raise Exception(
                _(
                    "Choose either fields to [Group By] and [Metrics] or "
                    "[Columns], not both"
                )
            )

        sort_by = fd.get("timeseries_limit_metric")
        if fd.get("all_columns"):
            d["columns"] = fd.get("all_columns")
            d["groupby"] = []
            order_by_cols = fd.get("order_by_cols") or []
            d["orderby"] = [json.loads(t) for t in order_by_cols]
        elif sort_by:
            sort_by_label = utils.get_metric_name(sort_by)
            if sort_by_label not in utils.get_metric_names(d["metrics"]):
                d["metrics"] += [sort_by]
            d["orderby"] = [(sort_by, not fd.get("order_desc", True))]

        # Add all percent metrics that are not already in the list
        if "percent_metrics" in fd:
            d["metrics"] = d["metrics"] + list(
                filter(lambda m: m not in d["metrics"], fd["percent_metrics"] or [])
            )

        d["is_timeseries"] = self.should_be_timeseries()
        return d

    def get_code(self, df):
        code = self.form_data.get("code", "")
        processor = get_template_processor(self.datasource.database)
        return processor.process_template(code, data=df.to_dict('r'))

    def get_data(self, df):
        print("markup df:%s" % df)
        markup_type = self.form_data.get("markup_type")
        code = self.get_code(df)
        if markup_type == "markdown":
            code = markdown(code, extensions=['tables'])
        return dict(html=code, theme_css=get_css_manifest_files("theme"))

markup.js

import { t } from '@superset-ui/translation';

export default {
  controlPanelSections: [
    {
      label: t('GROUP BY'),
      description: t('Use this section if you want a query that aggregates'),
      expanded: true,
      controlSetRows: [
        ['groupby'],
        ['metrics'],
        ['percent_metrics'],
        ['timeseries_limit_metric', 'row_limit'],
        ['include_time', 'order_desc'],
      ],
    },
    {
      label: t('NOT GROUPED BY'),
      description: t('Use this section if you want to query atomic rows'),
      expanded: true,
      controlSetRows: [
        ['all_columns'],
        ['order_by_cols'],
        ['row_limit', null],
      ],
    },
    {
      label: t('Query'),
      expanded: true,
      controlSetRows: [
        ['adhoc_filters'],
      ],
    },
    {
      label: t('Options'),
      expanded: true,
      controlSetRows: [
        ['table_timestamp_format'],
        ['page_length', null],
        ['include_search', 'table_filter'],
        ['align_pn', 'color_pn'],
      ],
    },
    {
      label: t('Code'),
      expanded: true,
      controlSetRows: [
        ['markup_type'],
        ['code'],
      ],
    },
  ],
  controlOverrides: {
    metrics: {
      validators: [],
    },
  },
};

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. For admin, please label this issue .pinned to prevent stale bot from closing the issue.

[mistercrunch]

FYI I have a proof of concept up too. It's looking pretty neat.

[gbrian]

@mistercrunch ,
Cool, I'm following same approach as NVD3. Which branch is your work?

Currently it implements basic charts with the option "Emit filter" so had to do some changes around. Still WIP so hope I can share soon.

[gbrian]

https://github.com/apache/incubator-superset/tree/echarts_poc

[maltoze]

https://github.com/apache/incubator-superset/tree/echarts_poc

import EchartsScatterChartPlugin from '@superset-ui/superset-ui-plugin-echarts-scatter/src';

Where is '@superset-ui/superset-ui-plugin-echarts-scatter/src'? I can't find it. @gbrian @mistercrunch