Metabase

SDK آنالیز تعبیه‌شده برای React

تحلیل سفارشی درون‌برنامه‌ای، با سرعتی که محصول شما نیاز دارد

کیت ابزاری که اجزای تعاملی متابیس را با ظاهر و رفتار محصول شما یکپارچه می‌کند. بدون بازاختراع چرخ، کنترل کامل روی تم، دسترسی و interaction داشته باشید.

npx @metabase/embedding-sdk-react@latest start
پیش‌نمایش رابط Embedding SDK متابیس

امن و چندمستاجره

داده از سرور شما خارج نمی‌شود و می‌توانید دقیقاً مشخص کنید هر مشتری چه چیزی را می‌بیند یا می‌تواند انجام دهد.

شروع در چند دقیقه

SDK را نصب کنید، سشن را منتقل کنید و اولین نمودار را سریعاً در محصول جاسازی کنید؛ سپس متناسب با نیاز رشد دهید.

مستندات و پشتیبانی توسعه‌دهنده

نمونه‌کد، پلاگین‌ها و تیم پشتیبانی در دسترس است تا ادغام شما طبق برنامه جلو برود.

بیش از ۸۰ هزار شرکت به متابیس اعتماد دارند

لوگوی Hugging Face
لوگوی McDonald's
لوگوی Huma
لوگوی Capital One
لوگوی Airbyte
لوگوی Betterment
لوگوی Deutsche Telekom
لوگوی Kong

یکپارچگی کامل با UI

هر جزء را دقیقاً جایی قرار دهید که به آن نیاز دارید

از نمودار تکی تا سازندهٔ پرسش، هر چیزی را جداگانه جاسازی کنید و بدون محدودیت عرض و ارتفاع، آن را با طراحی واکنش‌گرا هماهنگ کنید. منوها را بازآرایی کنید، فیلدها را بچینید و دکمه‌ها را جابه‌جا کنید تا تجربه‌ای بومی بسازید.

import {
  MetabaseProvider,
  InteractiveQuestion,
  defineEmbeddingSdkConfig,
} from "@metabase/embedding-sdk-react";

const config = defineEmbeddingSdkConfig({
  metabaseInstanceUrl: "https://metabase.example.com",
  authProviderUri: "https://app.example.com/sso/metabase",
});

<MetabaseProvider config={config}>
  <InteractiveQuestion
    questionId={42}
    isSaveEnabled={false}
    withResetButton
    customTitle="نرخ سفارش‌ها در زمان"
  />
</MetabaseProvider>;
نمایش جاسازی اجزای متابیس در رابط سفارشی

پوسته‌سازی زنده

فونت، رنگ و سایه را برای هر مشتری تغییر دهید

تم‌ها را با فونت سازمانی، پالت رنگ و اشکال اختصاصی تعریف کنید و برای هر سازمان یا حتی هر کاربر، تجربهٔ متفاوتی بسازید.

const theme = {
  fontFamily: "IRANSans",
  colors: {
    brand: "#5853FF",
    "brand-hover": "#423BDB",
    "text-primary": "#1F2933",
    background: "#F4F5FF",
    charts: ["#5853FF", "#FF6B6B", "#FDBF5E", "#22C55E"],
  },
  components: {
    dashboard: {
      card: { borderRadius: "20px", border: "1px solid #E0E7FF" },
    },
  },
};
نمونه پوسته‌های مختلف برای اجزای متابیس
پیش‌نمایش تم سفارشیپیش‌نمایش تم سفارشی

کنترل دسترسی جزءبه‌جزء

تعریف کنید چه کسی چه چیزی را ببیند یا انجام دهد

برای هر جزء، دسترسی خواندن، ذخیره‌سازی، drill-through و اکشن‌ها را تعیین کنید. کاربران عادی فقط تماشا می‌کنند، درحالی‌که تیم داده می‌تواند ویرایش و ذخیره انجام دهد.

switch (currentUser.role) {
  case "curator":
    return (
      <MetabaseProvider config={config} theme={theme}>
        <InteractiveQuestion questionId={questionId} />
      </MetabaseProvider>
    );
  default:
    return (
      <MetabaseProvider config={config} theme={theme}>
        <StaticQuestion questionId={questionId} />
      </MetabaseProvider>
    );
}
نمونه کنترل دسترسی در SDK متابیس

تجربه‌ای کاملاً سفارشی

رفتار و افزونه‌ها را با کد خودتان بنویسید

از پلاگین‌ها و رویدادها استفاده کنید تا اکشن اختصاصی به منو اضافه کنید، فیلترها را بازنویسی نمایید یا گردش‌کار جدیدی بسازید.

<MetabaseProvider
  config={config}
  theme={theme}
  pluginsConfig={{
    mapQuestionClickActions: (actions, clicked) => {
      if (clicked.column?.name === "user_id") {
        return [
          ...actions,
          {
            buttonType: "horizontal",
            type: "custom",
            name: "view-profile",
            icon: "person",
            title: "نمایش پروفایل کاربر",
            onClick: ({ closePopover }) => {
              goToProfile(clicked.value);
              closePopover();
            },
          },
        ];
      }
      return actions;
    },
  }}
/>;
نمونه تجربهٔ سفارشی شده با پلاگین
تصویر سخنران وبینار متابیس

وبینار زنده: آنالیز تعبیه‌شده با متابیس

در یک جلسهٔ زنده، مراحل پیاده‌سازی Embedding را از متخصصان متابیس یاد بگیرید.

همین حالا ثبت‌نام کنید

داستان موفقیت مشتریان SDK

شرکت‌هایی که داشبوردهای عمیق و یکپارچه را بدون تیم بزرگ مهندسی در محصول خود پیاده کرده‌اند.

لوگوی از ایده تا نسخهٔ عملی در ۳۰ روز

از ایده تا نسخهٔ عملی در ۳۰ روز

پلتفرم Marketfuel می‌خواست تجربهٔ فروشگاه آنلاین خود را بدون خروج از برند ارتقا دهد. با SDK، تنها در یک ماه و با یک توسعه‌دهنده به نمونهٔ قابل‌ارائه رسیدند.

«استفاده از متابیس برای ما نقطهٔ عطف بود؛ زمان و منابع را حفظ کرد و تجربهٔ مشتری را ارتقا داد.»

برایان اورسو، هم‌بنیان‌گذار و CTO

مطالعهٔ کامل
لوگوی کاهش زمان ساخت داشبورد از چند روز به چند ساعت

کاهش زمان ساخت داشبورد از چند روز به چند ساعت

Owlery نیاز داشت مشتری و تیم داخلی، بدون وابستگی مداوم به مهندسی، داشبورد بسازند و مدیریت کنند. SDK انعطاف لازم را فراهم کرد.

«از تصمیممان برای استفاده از SDK بسیار خوشحالیم؛ کنترل آیندهٔ محصول را به ما داد و تجربهٔ مشتری را عالی کرد.»

تراویس داونز، هم‌بنیان‌گذار Owlery

مطالعهٔ کامل

هر نوع جاسازی که لازم دارید

از راهکار سریع iframe تا سفارشی‌ترین پیاده‌سازی با SDK، مطابق نیازتان انتخاب کنید.

سریع

جاسازی Iframe

برای سازمان‌هایی که می‌خواهند بی‌درنگ تحلیل تعبیه‌شده را ارائه دهند و سربار مهندسی را پایین نگه دارند.

  • نمودار، داشبورد و گزارش را به‌صورت آماده در اپلیکیشن نمایش دهید.
  • حالت تعاملی اجازه می‌دهد سفارشی‌سازی، فیلتر و Drill انجام شود.
  • حالت استاتیک فقط نمایش داده را نشان می‌دهد و برای گزارش ساده مناسب است.
پیش‌نمایش جاسازی Iframeدموی زنده را ببینید
سفارشی

SDK آنالیز تعبیه‌شده برای React

برای تیم‌هایی که به تجربه‌ای بومی و کنترل کامل روی رفتار، تم و دسترسی نیاز دارند.

  • انتخاب کنید کدام جزء و در کدام صفحه قرار بگیرد.
  • دسترسی و تعامل را برای هر کاربر، تیم یا سازمان شخصی کنید.
  • با تم، پلاگین و اکشن اختصاصی، تجربه‌ای هم‌شکل با محصول خود بسازید.
پیش‌نمایش سفارشی‌سازی SDKدربارهٔ SDK بیشتر بدانید

هنوز پرسشی دارید؟ با ما در ارتباط باشید.

گفتگو با تیم متابیس

نمونهٔ عملی در کمترین زمان بسازید

اگر آماده‌اید تجربهٔ تحلیلی تعبیه‌شده‌ای ارائه دهید که با رشد شما تطبیق پیدا کند، همین امروز SDK متابیس را امتحان کنید.

اجرای دستور

npx @metabase/embedding-sdk-react@latest start
شروع سریع مستندات