2. 程式人生 > >amcharts _ 2.7.6 實現動態資料展現

amcharts _ 2.7.6 實現動態資料展現

阿新 • • 發佈：2019-02-03

老版的amcharts是基於flash的，新版的是javascript實現的，同樣amcharts 2.7.6支援頁面動態資料展現。

以下是方法：

二、修改amcharts_2.7.6\samples中的例項

     以下是area100PercentStacked.html的動態例項，程式碼如下：

   主要添加了：

chartData2變數

reloadData方法

loadStringData方法

手動重新整理按鈕

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"
    >
  2. <html>
  3.     <head>
  4.         <metahttp-equiv="Content-Type"content="text/html; charset=utf-8">
  5.         <title>amCharts examples</title>
  6.         <linkrel="stylesheet"href="style.css"type="text/css">
  7.         <scriptsrc="../amcharts/amcharts.js"type="text/javascript"
    ></script>
  8.         <scripttype="text/javascript">
  9.             var chart;  
  10.             var chartData = [{  
  11.                 year: 1994,  
  12.                 cars: 1587,  
  13.                 motorcycles: 650,  
  14.                 bicycles: 121  
  15.             }, {  
  16.                 year: 1995,  
  17.                 cars: 1567,  
  18.                 motorcycles: 683,  
  19.                 bicycles: 146  
  20.             }, {  
  21.                 year: 1996,  
  22.                 cars: 1617,  
  23.                 motorcycles: 691,  
  24.                 bicycles: 138  
  25.             }, {  
  26.                 year: 1997,  
  27.                 cars: 1630,  
  28.                 motorcycles: 642,  
  29.                 bicycles: 127  
  30.             }, {  
  31.                 year: 1998,  
  32.                 cars: 1660,  
  33.                 motorcycles: 699,  
  34.                 bicycles: 105  
  35.             }, {  
  36.                 year: 1999,  
  37.                 cars: 1683,  
  38.                 motorcycles: 721,  
  39.                 bicycles: 109  
  40.             }, {  
  41.                 year: 2000,  
  42.                 cars: 1691,  
  43.                 motorcycles: 737,  
  44.                 bicycles: 112  
  45.             }, {  
  46.                 year: 2001,  
  47.                 cars: 1298,  
  48.                 motorcycles: 680,  
  49.                 bicycles: 101  
  50.             }, {  
  51.                 year: 2002,  
  52.                 cars: 1275,  
  53.                 motorcycles: 664,  
  54.                 bicycles: 97  
  55.             }, {  
  56.                 year: 2003,  
  57.                 cars: 1246,  
  58.                 motorcycles: 648,  
  59.                 bicycles: 93  
  60.             }, {  
  61.                 year: 2004,  
  62.                 cars: 1218,  
  63.                 motorcycles: 637,  
  64.                 bicycles: 101  
  65.             }, {  
  66.                 year: 2005,  
  67.                 cars: 1213,  
  68.                 motorcycles: 633,  
  69.                 bicycles: 87  
  70.             }, {  
  71.                 year: 2006,  
  72.                 cars: 1199,  
  73.                 motorcycles: 621,  
  74.                 bicycles: 79  
  75.             }, {  
  76.                 year: 2007,  
  77.                 cars: 1110,  
  78.                 motorcycles: 210,  
  79.                 bicycles: 81  
  80.             }, {  
  81.                 year: 2008,  
  82.                 cars: 1165,  
  83.                 motorcycles: 232,  
  84.                 bicycles: 75  
  85.             }, {  
  86.                 year: 2009,  
  87.                 cars: 1145,  
  88.                 motorcycles: 219,  
  89.                 bicycles: 88  
  90.             }, {  
  91.                 year: 2010,  
  92.                 cars: 1163,  
  93.                 motorcycles: 201,  
  94.                 bicycles: 82  
  95.             }, {  
  96.                 year: 2011,  
  97.                 cars: 1180,  
  98.                 motorcycles: 285,  
  99.                 bicycles: 87  
  100.             }, {  
  101.                 year: 2012,  
  102.                 cars: 1159,  
  103.                 motorcycles: 277,  
  104.                 bicycles: 71  
  105.             }];  
  106.             var chartData2 = [{  
  107.                 year: 1995,  
  108.                 cars: 1567,  
  109.                 motorcycles: 683,  
  110.                 bicycles: 146  
  111.             }, {  
  112.                 year: 1996,  
  113.                 cars: 1617,  
  114.                 motorcycles: 691,  
  115.                 bicycles: 138  
  116.             }, {  
  117.                 year: 1997,  
  118.                 cars: 1630,  
  119.                 motorcycles: 642,  
  120.                 bicycles: 127  
  121.             }, {  
  122.                 year: 1998,  
  123.                 cars: 1660,  
  124.                 motorcycles: 699,  
  125.                 bicycles: 105  
  126.             }, {  
  127.                 year: 1999,  
  128.                 cars: 1683,  
  129.                 motorcycles: 721,  
  130.                 bicycles: 109  
  131.             }, {  
  132.                 year: 2000,  
  133.                 cars: 1691,  
  134.                 motorcycles: 737,  
  135.                 bicycles: 112  
  136.             }, {  
  137.                 year: 2001,  
  138.                 cars: 1298,  
  139.                 motorcycles: 680,  
  140.                 bicycles: 101  

  141. 相關推薦

    amcharts _ 2.7.6 實現動態資料展現

    老版的amcharts是基於flash的，新版的是javascript實現的，同樣amcharts 2.7.6支援頁面動態資料展現。 以下是方法： 二、修改amcharts_2.7.6\samples中的例項      以下是area10

    【Hadoop】Hadoop 2.7.6安裝_偽分散式叢集

    本篇主要演示在Linux上安裝單節點Hadoop模式，以及偽分散式Hadoop模式。一 安裝環境作業系統：Oracle Linux Server release 6.5；Java版本：java-1.7.0-openjdk-1.7.0.45；Hadoop版本：hadoop-2.

    Python 2.7.6 安裝lxml模塊[ubuntu14.04 LTS]

    targe 分享 python round .html back ubunt 文件 ati lxml --->首字母是字母l，不是數字１ lxml 2.x : https://pypi.python.org/pypi/lxml/2.3 1xml官網：http

    Ngnix技術研究系列2-基於Redis實現動態路由

    spa esp text 應用 list cached cap postman blank 上篇博文我們寫了個引子： Ngnix技術研究系列1-通過應用場景看Nginx的反向代理 發現了新大陸，OpenResty OpenResty 是一個基於 Nginx 與 Lua

    anaconda安裝Opencv報錯：Could NOT find PythonLibs: Found unsuitable version "2.7.6",

    list open version packages 拷貝 uitable /usr req imp 機器上裝了兩個python，一個是默認的，一個是anaconda。安裝opencv時就報錯了： -- Found PythonInterp: /home/deeplp/an

    Ext3 Functhion擴展的5個實例方法 p135 4.2.7.6

    src blog 技術分享 mage alt 圖片 img com 4.2 Ext3 Functhion擴展的5個實例方法 p135 4.2.7.6

    Python-2.7.6安裝~

    查詢 mod ctime enable .so usr red port 一行 一、檢查看依賴環境是否安裝 gcc –vgcc是最基本的開發庫，gcc –v 查詢gcc的版本，如果有以下信息證明了gcc已安裝，如果出現“command not found”證明沒有安裝，需要

    jQuery1.7+如何實現動態事件繫結

    .on( events [, selector ] [, data ], handler(eventObject) ) data 型別: Anything 當一個事件被觸發時，要傳遞給事件處理函式的event.data。 <button class="num1">點選

    7-6 混合型別資料格式化輸入（C語言）

    本題要求編寫程式，順序讀入浮點數1、整數、字元、浮點數2，再按照字元、整數、浮點數1、浮點數2的順序輸出。 輸入格式： 輸入在一行中順序給出浮點數1、整數、字元、浮點數2，其間以1個空格分隔。 輸出格式： 在一行中按照字元、整數、浮點數1、浮點數2的順序輸出，其中浮點數保留小數點後2

    hadoop-2.7.6 完全分散式的安裝

    準備環境           CentOS 7           jdk1.8 (這裡建議使用1.8版本的jdk 連結:https://www.oracle.com/technetwork/ja

    2-7 R語言基礎 資料框

    #資料框   > df <- data.frame(id=c(1,2,3,4),name=c("a","b","c","d"),gender=c(TRUE,TRUE,FALSE,FALSE))> nrow(df) #4行[1] 4 > ncol(df) #3列[1] 3

    python 2.7.3(ubuntu12.04 default python) 升級到 python 2.7.6 版本的方法

    dig ner traceback sha256 read tput inux ubuntu12 mkdir android 代碼編譯時遇到如下問題需要將 ubuntu 下 python2.7.3 升級到 python 2.7.6 及以上。 [100% 109208/10

    J2Cache 的 Spring Boot 模組釋出 2.7.6 版本

       J2Cache 官方提供兩個版本的 Spring Boot 模組，目前釋出了 2.7.6 版本，主要改進：添加了一個可以開啟關閉二級快取的配置，並支援在spring配置中寫j2cache的配置，並修復一些細小問題。 Maven: Spring Boot 1.x <d

    PTA-7-6 混合型別資料格式化輸入

    7-6 混合型別資料格式化輸入 （5 分） 本題要求編寫程式，順序讀入浮點數1、整數、字元、浮點數2，再按照字元、整數、浮點數1、浮點數2的順序輸出。 輸入格式： 輸入在一行中順序給出浮點數1、整

    java專案中antlr-2.7.6.jar和ant.jar的作用

    1：antlr-2.7.6.jar的作用 專案中如果沒有新增antlr-2.7.6.jar，那麼相關的hibernate對映不會執行hql語句 並且會報NoClassDefFoundError:antlr/ANTLRException錯誤。 2：ant.jar ant

    Unity應用架構設計(6)——設計動態資料集合ObservableList

    什麼是 『動態資料集合』 ？簡而言之，就是當集合新增、刪除專案或者重置時，能提供一種通知機制，告訴UI動態更新介面。有經驗的程式設計師腦海裡迸出的第一個詞就是 ObservableCollection。沒錯，它在WPF中盛行其道，通過它開發者可以很方便的達到動態更新介面。要在Unity 3D中使用Obser

    C#：簡單實現動態資料生成Word文件並儲存

    今天正好有人問我，怎麼生成一個報表式的Word文件。 就是文字的樣式和位置相對固定不變，只是裡面的內容從資料中讀取。 我覺得類似這種的一般用第三方報表來做比較簡便。但既然要求了Word，只好硬著頭皮來。 網上的方法大多數都是從一個GridView或表中獲得資料後向Word

    Hadoop-2.7.6雙namenode配置搭建（HA）高可用叢集部署教程

    配置雙namenode的目的就是為了防錯，防止一個namenode掛掉資料丟失，具體原理本文不詳細講解，這裡只說明具體的安裝過程。Hadoop HA的搭建是基於Zookeeper的，關於Zookeeper的搭建可以檢視這裡 hadoop、zookeeper、hbase、spa

    [Echarts視覺化] 二.php和ajax連線資料庫實現動態資料視覺化

    前一篇文章 "[Echarts視覺化] 一.入門篇之簡單繪製中國地圖和貴州地區" 主要是通過Echarts視覺化介紹入門知識、中國地圖和貴州地區各省份的資料分析，其中貴州地圖才是它的核心內容。這篇文章主要結合PHP、MySQL、JQuery和Ajax從資料庫中獲取資料，動態的

    Linux中Python安裝與配置(CentOS-6.5：Python-2.7.6)

    1 Python簡介     Python（英語發音：/?pa?θ?n/）, 是一種面向物件、解釋型計算機程式設計語言，由Guido van Rossum於1989年底發明，第一個公開發行版發行於1991年。Python語法簡潔而清晰，具有豐富和強大的類庫。它常被暱稱為膠水