一、前台

建个名为map.html,代码如下。

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
  <title>分类页面</title>
  <script type="text/javascript" src="__PUBLIC__/js/echarts.min.js"></script>

  <script type="text/javascript" src="__PUBLIC__/js/jquery.js"></script>

</head>
<body>
  <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
  <div id="main" style="width: 600px;height:400px;"></div>
</body>
<script type="text/javascript">
  var myChart = echarts.init(document.getElementById('main'));
  var arr1=[],arr2=[];
  function arrTest(meter_no){
  $.ajax({
  type: "post",
  async:false,
  url: "{:U("Property/maptext")}",
  data: {},
  dataType: "JSON",
  success: function(data){
    for (var i = 0; i < data['name'].length; i++) {
      arr1.push(data['name'][i]);
    }
    for (var i = 0; i < data['age'].length; i++) {
      arr2.push(data['age'][i]);
    }
  }
});
return arr1,arr2;
}
arrTest();
var option = {
  title: {
    text: '测试'
  },
  tooltip: {
    show: true
  },
  legend: {
    data:['age']
  },
  xAxis : [
  {
    type : 'category',
    data : arr1
  }
  ],
  yAxis : [
  {
    type : 'value'
  }
  ],
  series : [
  {
    "name":"age",
    "type":"bar",
    "data":arr2
  }
  ]
};
// 为echarts对象加载数据
myChart.setOption(option);

</script>
</html>

二、后台

建个名为PropertyController.class.php控制器,代码如下。

public function map(){
$this->display();
}

public function maptext(){
$poem = array();
$poem['name'] = ["测试1","测试2","测试3","测试4","测试5","测试6"];
$poem['age'] = [15, 25, 45, 34, 40, 25];
$this->ajaxReturn ($poem,'JSON');

}

三、展示画面:

echarts+thinkphp 学习写的第一个程序的更多相关文章

  1. OpenGL学习笔记1——第一个程序

    学习的参考书基本是按照GL编程指南,如果有消息机制概念,对于GLUT的理解是很自然的.下面就按照自己写的第一个程序详细解释一下GL,还是比较容易上手的. 程序实现的功能是,根据当前随即种子摇出来的结果 ...

  2. DirectX11 学习笔记1 - 第一个程序

    为了加快学习速度,和使程序更加easy理解.  我把sampler tutorial里面的一个样例 的固定代码和常常修改的代码经过简单的类的封装了一下. 以后学习的时候就能够仅仅在还有一个文件写ren ...

  3. (转载)OC学习篇之---第一个程序HelloWorld

    之前的一片文章简单的介绍了OC的相关概述,从这篇开始我们就开始学习OC的相关知识了,在学习之前,个人感觉需要了解的其他的两门语言:一个是C/C++,一个是面向对象的语言(当然C++就是面向对象,不过这 ...

  4. OC学习篇之---第一个程序HelloWorld

    从这篇开始我们就开始学习OC的相关知识了,在学习之前,个人感觉需要了解的其他的两门语言:一个是C/C++,一个是面向对象的语言(当然C++就是面向对象,不过这里最好还是Java).在干活之前,得先找到 ...

  5. ICE学习第二步-----从第一个程序了解ICE(HelloWorld)

    ICE(Internet Communications Engine)是一种面向对象的中间件平台,主要用于网络通讯.它为面向对象的“客户端-服务器”模型的应用提供了一组很好的工具和API接口.目前在全 ...

  6. 重新学习之spring第一个程序,配置IOC容器

    第一步:导入相关jar包(此范例导入的是spring3.2.4版本,spring2.5版本只需要导入spring核心包即可) 第二步:在项目的src下配置applicationContext.xml的 ...

  7. android学习三---创建第一个程序

    1.创建一个Helloworld程序 1.1 new-android application 点击file-new-android application出现如下界面 填上应用名,项目名,包名,选择所 ...

  8. 4.用springboot写的第一个程序--helloworld

    这是我自己在controller层建的hello类 运行,选画方框的那个.我查了一晚上,可算知道为啥运行不了了. 然后再浏览器输入网址就ok了 为了大力!好好学习!

  9. Objective-C学习笔记(三)——用Objective-C编写第一个程序:Hello,World!

    不管是哪一个程序猿,或者是学习哪一门计算机语言.写的第一个程序基本上就是Hello World. 今天我们用OC来实现第一个程序:Hello World. 在Xcode中选择新建一个项目,在对话框中选 ...

随机推荐

  1. python——3.x的异常处理 请注意了

    以前的python2.x的时候:try:        fp=urllib.request.urlopen(blogurl)    except Exception, e:        print  ...

  2. 【BIEE】17_仪表盘提示中值按顺序显示

    我们在使用仪表盘提示的时候,常常会遇到这种问题,客户需要将一些常见的放在最上边,这样方便显示 例如:现在有数据库表如下 我们需要在提示中展示机构名称,我们如下新建提示 展示效果如下: 我们从上图可以看 ...

  3. C++常考面试题汇总(持续更新中)

    c++面试题 一 用简洁的语言描述 c++ 在 c 语言的基础上开发的一种面向对象编程的语言: 应用广泛: 支持多种编程范式,面向对象编程,泛型编程,和过程化编程:广泛应用于系统开发,引擎开发:支持类 ...

  4. 转:介绍一个好用的抓取dump的工具-ProcDump

    介绍一个好用的抓取dump的工具-ProcDump Procdump是一个轻量级的Sysinternal团队开发的命令行工具, 它的主要目的是监控应用程序的CPU异常动向, 并在此异常时生成crash ...

  5. 工作总结 Ajax.BeginForm 默认action

    生成源代码 点提交 总结 BeginForm 的 active 默认指向 进当前页面的 操作方法    若第一次进页面时带着参数, 那么也会将参数放到active 简单点  BeginForm 的 a ...

  6. Cocos2D-X2.2.3学习笔记10(几何图形)

    我们这节来学习几何图形,即怎样使用Cocos2d-x绘制各种图形.已经贝塞尔曲线 我们查看CCNode中有个draw函数,我们须要将绘制的代码所有写在这个函数里面.写在init函数里是画不出线来的, ...

  7. Cocos2d-x 3.x版2048游戏开发

    Cocos2d-x 3.x版2048游戏开发 本篇博客给大家介绍怎样高速开发2048这样一款休闲游戏,理解整个2048游戏的开发流程.从本篇博客你将能够学习到下面内容: 这里注明一下,本教程来自极客学 ...

  8. 文件打开的过程——调用fd=open()时操作系统所做的工作

    fd=fopen()是一个系统调用.用于依据文件名称打开一个文件.返回该文件的文件描写叙述符,文件打开后进程便能够依据文件描写叙述符fd进行其它操作,比方读,写,关闭等操作. 各个操作系统打开文件的过 ...

  9. Strategy模式

    Strategy模式 Strategy模式要解决的问题和Template模式类似.都是为了把算法的声明和算法的实现解耦.Template模式是通过继承来实现的,而Strategy模式是通过组合来实现的 ...

  10. Visual Studio- “无法启动此程序,因为计算机中丢失 xxx.dll尝试重新安装该程序以解决此问题"

    下午使用VS 2013调试程序时,发现弹出了下列的错误弹框: 网上搜索之后发现是缺失了动态链接库(.dll)文件所致,因此只需要把相应的动态链接库文件放置到指定的目录即可. 另:64位系统用户需要注意 ...