getOrgChart 多行 header 和链接

Question

我最近购买了您的 gerOrgChart 插件，并且一直在为一些事情而苦苦挣扎。我正在使用自定义主题 1。该主题对我来说非常有用。但是，就我而言，每张卡片的名称标签都很长。我不喜欢使用 '...' ，而是根据卡片的宽度将整个文本分成多行。我还需要添加一个 link 到它。但是数据源不会呈现我添加到特定数据的 html href 标记。

脚本：

getOrgChart.themes.myCustomTheme =
{
    size: [270, 400],
    toolbarHeight: 46,
    textPoints: [
    { x: 30, y: 50, width: 240},
    { x: 30, y: 120, width: 240},
    { x: 30, y: 150, width: 240}
    ],
    textPointsNoImage: [
    { x: 30, y: 50, width: 240},
    { x: 30, y: 120, width: 240},
    { x: 30, y: 150, width: 240}
    ],
    expandCollapseBtnRadius: 20,
    defs: '<filter id="f1" x="0" y="0" width="200%" height="200%"> 
    <feOffset result="offOut" in="SourceAlpha" dx="5" dy="5" /> 
    <feGaussianBlur result="blurOut" in="offOut" stdDeviation="5" /> 
     <feBlend in="SourceGraphic" in2="blurOut" mode="normal" /> 
    </filter>',
    box: '<rect x="0" y="0" height="400" width="270" rx="10" ry="10" 
    class="myCustomTheme-box" filter="url(#f1)"  />',
    text: '<text text-anchor="start" width="[width]" class="get-text 
    get-text-[index]" x="[x]" y="[y]">[text]</text>',
    };

    var name = '<a href=www.google.com> Google </a>;
    data.push({id: current_record_number++ ,parentId: level,
    name: name,
    Stake: ' 10% Stake',
    RevHeading: 'Revenue'
    });

    data = [{id: 1, parentId: null, name: 'xyz', Stake: '-'}];
    var peopleElement = document.getElementById("peoples");
    var orgChart = new getOrgChart(peopleElement, {
    theme: "myCustomTheme",
    enableEdit: false,
    scale: 0.5,
    enableSearch: false,
    linkType: "B",
    color: "neutralgrey",
    enableGridView: true,
    primaryFields: ["name", "Stake", "Date", "RevHeading"],
    dataSource: data
    });
</script>

Answer 1

我们修改了 create-your-own-theme-1 页面，以便向您展示如何实现请求的功能 http://www.getorgchart.com/experimental/create-your-own-theme-1.html

getOrgChart 多行 header 和链接

getOrgChart multiline header and links

javascript

css

getorgchart