AnyChart是基于JavaScript (HTML5) 的圖表控件。使用AnyChart控件，可創(chuàng)建跨瀏覽器和跨平臺(tái)的交互式圖表和儀表。AnyChart 圖表目前已被很多知名大公司所使用，可用于儀表盤(pán)、報(bào)表、數(shù)據(jù)分析、統(tǒng)計(jì)學(xué)、金融等領(lǐng)域。重要推薦：<a href="//chat8.live800.com/live800/chatClient/chatbox.jsp?companyID=60357&configID=149250&jid=1316272045&s=1" target="_blank"  underline; color: rgb(255, 0, 0);">AnyChart已加入在線訂購(gòu)，超值特惠限時(shí)搶購(gòu)！咨詢?cè)斍?gt;>

AnyChart現(xiàn)已更新至最新版本8.7.0，九大數(shù)據(jù)可視化新功能上線，改進(jìn)了功能并修復(fù)了一些bug。新版本，新功能，趕快下載體驗(yàn)吧~（點(diǎn)擊查看更新詳情）

點(diǎn)擊下載AnyChart最新試用版

Q：如何刪除列（條形，區(qū)域）邊框？

A：要從JavaScript區(qū)域圖或JavaScript餅圖或其他AnyChart圖表類型中刪除項(xiàng)目邊框，您需要使用以下代碼禁用筆劃： series.stroke（null）; 就像示例中所示。  

HTML

<div id="container"></div>

CSS

html, body, #container {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

JavaScript

anychart.onDocumentReady(function() {
  // create area chart
  chart = anychart.area();
  // create area series with passed data
  var series = chart.area([
    ['P1' , 162],
    ['P2' , 134],
    ['P3' , 116]
  ]);
  // remove area border
  series.stroke(null);
  // set yScale minimum to 0
  chart.yScale().minimum(0);
  
  // draw
  chart.container('container').draw();
});

Q：如何使用JSON格式創(chuàng)建具有多個(gè)系列的圖表？

A：JSON數(shù)據(jù)集可以包含一個(gè)或多個(gè)系列-幾乎與您在JavaScript中執(zhí)行此操作的方式相同。使用JSON格式設(shè)置數(shù)據(jù)與JavaScript中設(shè)置數(shù)據(jù)的方式非常相似。JSON配置中每個(gè)對(duì)象的名稱都與JavaScript中的方法或參數(shù)的名稱相對(duì)應(yīng)。因此，要?jiǎng)?chuàng)建（例如，使用JSON的線系列），應(yīng)使用以下代碼：

"seriesType": "line":
"series": [{  //series type  "seriesType": "line"
  //series data
  "data": [
    {"x": "P1", "value": "128.14"},
    {"x": "P2", "value": "112.61"},
    {"x": "P3", "value": "163.21"},
    {"x": "P4", "value": "229.98"},
    {"x": "P5", "value": "90.54"}
  ]
}]

A：完全有可能像其他JavaScript Web Chart組合圖示例一樣創(chuàng)建此圖。
下面的代碼示例演示了此選項(xiàng)。

HTML

<div id="container"></div>

CSS

html, body, #container {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

JavaScript

anychart.onDocumentReady(function() {
  // create data set on our data
  var dataSet = anychart.data.set([
    ['P1', 174, 5854, 3242, 162],
    ['P2', -197, -4171, 3171, 134],
    ['P3', -155, -1375, 700, 116],
    ['P4', -15, -1875, 1287, 122],
    ['P5', 66, 2246, 1856, 178],
    ['P6', -85, 2696, 1126, 100],
    ['P7', 37, 1287, 987, 125],
    ['P8', -10, 2140, 1610, 176],
    ['P9', 44, 1603, 903, 111],
    ['P10', 322, 1628, 928, 134]
  ]);
  // map data for the first series, take x from the zero column and value from the first column of data set
  var seriesData_1 = dataSet.mapAs({x: [0], value: [1]});
  // map data for the second series, take x from the zero column and value from the second column of data set
  var seriesData_2 = dataSet.mapAs({x: [0], value: [2]});
  // map data for the third series, take x from the zero column and value from the third column of data set
  var seriesData_3 = dataSet.mapAs({x: [0], value: [3]});
  // create column chart
  chart = anychart.column();
  // turn on chart animation
  chart.animation(true);
  // set chart title text settings
  chart.title('Combination of Column, Spline-Area and Spline Chart');
  // create scale for line series and extraYAxis
  // it force line series to not stuck values with over series
  var scale = anychart.scales.linear();
  // create extra axis on the right side of chart
  var extraYAxis = chart.yAxis(1);
  extraYAxis.title('Secondary Y-Axis');
  extraYAxis.orientation('right');
  extraYAxis.scale(scale);
  // create second series with mapped data
  chart.column(seriesData_2);
  // create third series with mapped data
  var splineArea = chart.splineArea(seriesData_3);
  // create line series and set scale for it
  var lineSeries = chart.spline(seriesData_1);
  lineSeries.yScale(scale);
  lineSeries.stroke('2.5 #ef6c00');
  //draw
  chart.container('container').draw();
});

=====================================================

想要購(gòu)買Anychart正版授權(quán)的朋友可以。

更多精彩內(nèi)容，歡迎關(guān)注下方的微信公眾號(hào)，及時(shí)獲取產(chǎn)品最新資訊▼▼▼