ZingChart 饼图工具提示不显示

Question

我有一个 ZingChart 饼图，用于显示简单数据。它恰好在使用 angular 并在用户向下钻取时更新系列对象。

一切正常，除了...工具提示不显示？无论交互或系列分配如何，它都不会在任何时候显示。标准的鼠标悬停突出显示有效，单击节点很好，但没有工具提示。有任何想法吗？无法弄清楚我错过了什么！我的图表配置是：

{
        type: "pie",
        id: 'chart-1',
        title: {
          textAlign: 'center',
          text: "Loading..."
        },
        "legend":{
          "border-width":1,
          "border-color":"gray",
          "border-radius":"5px",            
          "marker":{
            "type":"circle"
          },
          "toggle-action":"remove",
          "icon":{
            "line-color":"#9999ff"
          }
        },   
        "plot": {
          "animation":{
            "on-legend-toggle": true,
            "effect": 5,
            "method": 1,
            "sequence": 1,
            "speed": 0.7
          },
          "value-box": {
            "text": "$%v",
            "negation": "currency",
            "thousands-separator": ",",
            "font-color": "black",
            "placement":"in",
            "offset-r":"50%",
            "font-size":"12"            
          },
          "tooltip":{
            "text":"%t: %v (%npv%)"                
          },
          "decimals": "0",
          "detach": false
        },
        series: [],
        shapes: [{
          type: 'triangle',
          backgroundColor: '#66ccff',
          size: 10,
          angle: -90,
          x: 20,
          y: 20,
          cursor: 'hand',
          id: 'backwards'
        }]
      };

Answer 1

chart-1 中的 - 导致我们的 parse/selector 流程出现问题。如果您将 id 更改为 chart_1 一切都会正常进行。

var myConfig = {
"graphset":[
    {
        "type":"pie",
        "id":"chart_1",
        "title":{
            "textAlign":"center",
            "text":"Loading..."
        },
        "legend":{
            "border-width":1,
            "border-color":"gray",
            "border-radius":"5px",
            "marker":{
                "type":"circle"
            },
            "toggle-action":"remove",
            "icon":{
                "line-color":"#9999ff"
            }
        },
        "plot":{
            "animation":{
                "on-legend-toggle":true,
                "effect":5,
                "method":1,
                "sequence":1,
                "speed":0.7
            },
            "value-box":{
                "text":"$%v",
                "negation":"currency",
                "thousands-separator":",",
                "font-color":"black",
                "placement":"in",
                "offset-r":"50%",
                "font-size":"12"
            },
            "decimals":"0",
            "detach":false
        },
        "tooltip":{
            "text":"%t: %v (%npv%)"
        },
        "series":[
            {
                "values":[118],
                "text":"0-30"
            },
            {
                "values":[118],
                "text":"0-30"
            },
            {
                "values":[118],
                "text":"0-30"
            }
        ],
        "shapes":[
            {
                "type":"triangle",
                "backgroundColor":"#66ccff",
                "size":10,
                "angle":-90,
                "x":20,
                "y":20,
                "cursor":"hand",
                "id":"backwards"
            }
        ]
    }
]
};

zingchart.render({ 
 id: 'myChart', 
 data: myConfig, 
 height: '100%', 
 width: '100%' 
});

html, body {
 height:100%;
 width:100%;
 margin:0;
 padding:0;
}
#myChart {
 height:100%;
 width:100%;
 min-height:150px;
}

<!DOCTYPE html>
<html>
 <head>
  <script src= "https://cdn.zingchart.com/zingchart.min.js"></script>
  </head>
 <body>
  <div id="myChart"></div>
 </body>
</html>

ZingChart 饼图工具提示不显示

ZingChart pie tooltip not displaying

javascript

charts

zingchart