Rumah pembangunan bahagian belakang tutorial php 详解Symfony2框架创建项目和设置模板

详解Symfony2框架创建项目和设置模板

Jan 05, 2018 pm 05:50 PM
cipta projek

本文主要介绍了Symfony2框架创建项目与模板设置的方法,结合实例形式详细分析了Symfony2框架的具体步骤与详细实现代码。需要的朋友可以参考下,希望对大家有所帮助。

环境准备与概览

习惯于在windows使用netbean编辑器并使用virtualbox虚拟centos系统, 预将nginx+php-fpm+mysql,  当然apache也是不错的选择,   使用http://symfony在windows与centos上作为开发域名。

一、下载与环境设置

1. 如何于centos上面建立开发环境不再详述, 当然也可以在windows上面建立开发环境。

2. 关于使用 symfony代替127.0.0.1 在liunx系统中修改/etc/hosts文件, win7系统中修改 C:\Windows\System32\drivers\etc\host 文件(需要用管理员权限打开)

加入类似于IP 别名1 别名2的内容即可, 如:

# /etc/hosts 127.0.0.1 symblog dev symfony
Salin selepas log masuk

3.手动下载symfony2。

唯一需要注意的是: app/cache 和app/logs目录需要设置成777权限。windows的开发环境应该不存在这个问题。

4. 修改apache 或者nginx配置文件symfony域名指向下载的symfony文件的web目录。

此时应该可以通过 http://symfony/app_dev.php 访问到symfony的默认页面, 有几个demo可以参照学习。

app_dev.php 默认加载了一个开发工具条在下面, 显示了当前页面的一些信息, 极大地方便了程序的调试, 只有当环境变量为dev时才会显示。

5. 使用composer安装时, 会提示输出mysql等相关信息, 需要修改这些信息, 或者是直接下载的文件, 可以进入页面的“Configure” 进行相关设置。

Bundles(也许可以称之为包, 束, 程序集,或者项目, 还是用英文吧)是symfony的基础东东, 一个个分享出来可重复利用的代码封装, 甚至于symfony本身是作为一个bundles运行的。 包括控制器、模块、模板, 甚至于图像与js, css样式表等资源。 很杂乱的东西, 区别不同的bundles使用了php5.3以后的命名空间, 大部分cpenal, da虚拟主机好像只有php5.2版本吧, 无法运行symfony2了。

二、创建一个Bundle

在下面的例子中将创建一个博客, Symfony 提供了大量工具来快速地创建项目。 比如我们可以用它来快速创建一个博客的基础bundle.

php app/console generate:bundle –namespace=Blogger/BlogBundle –format=yml
Salin selepas log masuk

运行后直接采用所有的默认设置即可。 可以方便地创建我们所需要的基本控制器, 模块与模板等。 包含了下面的行为:

注册Bundles

在symfony中所有使用的bundles都要求先被注册, 有些bundles只会使用于开发测试环境(dev or test), 如前文提及的开发工具条. 下面这断代码显示了bundles创建命令如何注册BloggerBlogBundle这个bundle.

// app/AppKernel.php
class AppKernel extends Kernel {
public function registerBundles() {
$bundles = array(
// ..
new Blogger\BlogBundle\BloggerBlogBundle(),
);
// .. return $bundles; } // ..
}
}
Salin selepas log masuk

路由

作为一个框架, 路由功能被bundler创建器创建于app/config/routing.yml, symfony是用yml格式来保存配置信息。

# app/config/routing.yml
BloggerBlogBundle:
resource: "@BloggerBlogBundle/Resources/config/routing.yml"
prefix: /
Salin selepas log masuk

prefix前缀选项允许我们可以将其放置于如blog、news等子目录下。
文件
除了以上配置文件外, 其它大部分文件生成为src目录下, 如同大部分mvc框架。 在src下生成Blogger目录, 并有BlogBundle子目录存放着各种相关东东。不同的是类似于blogger的目录对应着php命名空间。

默认控制器

Bundle生成器在src下面生成了默认了控制器。 通过访问: http://symfony/app_dev.php/hello/world 可以看到简单的问候。 关于这个页面是如何生成:

路由

还是路由, 不同的是前面的路由是在整个程序里面注册使用, 这里的路由是控制具体页面使用, src/Blogger/BlogBundle/Resources/config/routing.yml 控制了BloggerBlogBundle, 包含以下程序片断:

# src/Blogger/BlogBundle/Resources/config/routing.yml
BloggerBlogBundle_homepage:
pattern: /hello/{name}
defaults: { _controller: BloggerBlogBundle:Default:index }
Salin selepas log masuk

参数: 进行url检测, 符合/hello/{name}结构的任意值将被赋予给{name},
方式: 没有对形式进行限制, 理论可以put, get, post, delete所有的操作都可以进行。
后续: 如果符合以上两条, 那么{name}将会传导至特定文件, 以上为src/Blogger/BlogBundle/Controller/DefaultController.php文件中的default控制器的index行为将被使用。

控制器

在默认生产的bundler中, 控制器行为相当简单, {name}参数被传入并被传出到模板文件:

// src/Blogger/BlogBundle/Controller/DefaultController.php
namespace Blogger\BlogBundle\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;
class DefaultController extends Controller
{
public function indexAction($name)
{
return $this->render('BloggerBlogBundle:Default:index.html.twig', array('name' => $name));
}
}
Salin selepas log masuk

BloggerBlogBundle:Default:index.html.twig 会使用 BloggerBlogBundle views文件夹中 Default文件夹下面index.html.twig模板文件.

模板文件

打开上述模板文件, 非常简单的一句代码:

{# src/Blogger/BlogBundle/Resources/views/Default/index.html.twig #}
Hello {{ name }}!
Salin selepas log masuk

以上就是symfony的整个mvc流程, 这么多文件的作用只是输出一个 “hello world”. 理论上不用bundler创建器, 只是手动创建上述文件也可以实现相同效果。花费的时间就多了去了。

回到正题, 我们是创建博客系统, 所以不需要 hello world,

1.移除控制器 src/Blogger/BlogBundle/Controller/DefaultController.php
2.移除模板 src/Blogger/BlogBundle/Resources/views/Default/
3.最后移除路由 src/Blogger/BlogBundle/Resources/config/routing.yml
整个世界清静了。

三、让我们开始创建博客的主页

Twig的优点

在symfony中我们可以使用 Twig和php(这不是废话嘛)作为模板。使用Twig的以下优点:

1. 快: 是编绎过的php类, 可以占用更少的资源

2. 简洁:想想看要打, Twig输入的内容要少很多。

3. 可继承: 非常cool的一个功能

4. 安全: 转义功能默认开启, 甚至还可以为重要代码提供沙盒功能。

5. 可扩展: 需要额外的定制功能, 可以随时扩展

可继承是一个非常好的优点, 我们将使用三级继承结构来定制这个模板, 这将允许我们在三个不同层级修改模板, 方便自由定制。

主模板–level 1

<!– app/Resources/views/base.html.twig –>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html"; charset=utf-8" />
<title>{% block title %}symfony{% endblock %} – blog</title>
<!–[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]–>
{% block stylesheets %}
<link href=&#39;http://fonts.googleapis.com/css?family=Irish+Grover&#39; rel=&#39;stylesheet&#39; type=&#39;text/css&#39;>
<link href=&#39;http://fonts.googleapis.com/css?family=La+Belle+Aurore&#39; rel=&#39;stylesheet&#39; type=&#39;text/css&#39;>
<link href="{{ asset(&#39;css/screen.css&#39;) }}" type="text/css" rel="stylesheet" />
{% endblock %}
<link rel="shortcut icon" href="{{ asset(&#39;favicon.ico&#39;) }}" />
</head>
<body>
<section id="wrapper">
<header id="header">
<p>
{% block navigation %}
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
{% endblock %}
</p>
<hgroup>
<h2>{% block blog_title %}<a href="#">symfony</a>{% endblock %}</h2>
<h3>{% block blog_tagline %}<a href="#">creating a blog in Symfony2</a>{% endblock %}</h3>
</hgroup>
</header>
<section>
{% block body %}{% endblock %}
</section>
<aside>
{% block sidebar %}{% endblock %}
</aside>
<p id="footer">
{% block footer %}
<a href="http://blog.dengruo.com/201309/1409">Symfony2 博客教程</a>
{% endblock %}
</p>
</section>
{% block javascripts %}{% endblock %}
</body>
</html>
Salin selepas log masuk

上面代码在引入了一个js文件, 在ie9版本前的浏览器中实现html, 以及两个css文件导入google fronts.
这构成了网页的主要内容结构, 相当于drupal的html.tpl.php+page.tpl.php.
让我们看一下头部文件

<title>{% block title %}blog{% endblock %} – symfony</title>
Salin selepas log masuk

{% 标签中即不是html, 也不是php, 他是3个Twig标签中的一个, 用于执行某些动作。 这里可以找到完整的Twig控制动作用于这个标签。 回到当前代码, 是用于查找title的block并输出他, 如果没有则输出默认的symblo这个词。
Twig的可续承特性可以用于修改title, 我们可以在其它模板文件中重写它:

{% extends &#39;::base.html.twig&#39; %}
{% block title %}The blog title goes here{% endblock %}
Salin selepas log masuk

上面代码首先继承了第一次定义这个block的文件, 然后修改它。 网站标题部分会输出 'The blog title goes here – symfony'。
一般而言, 我们引用模板文件时会采用bundle:controller:template, 但是以上代码并没有bundle 和controller, 不包含这两个字段会直接引用app/Resources/views/ 文件夹下面的文件。

在css样式表中, 我们可以发现另一个Twig标签{{, 这是一个输出(说些什么)标签。

<link href="{{ asset(&#39;css/screen.css&#39;) }}" type="text/css" rel="stylesheet" />
Salin selepas log masuk

这个标签用于输出变量或者表达式, 上面例子输出了asset函数的返回值, 这个函数提供可移植的方式来返回css,js, 图片的地址。

这个标签可以以特定格式输出我们想要内容, 比如时间:

{{ blog.created|date("d-m-Y") }}
Salin selepas log masuk

全部过滤列表在 Twig 文档可以查到。

最后一个标签并没有在上述代码中出现, 它是{#, 只是一个注释标签

{# 注释内容可以输出在这里 #}

接下来我们将创建css样式表web/css/screen.css , 加入以下内容.

html,body,p,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}
body { line-height: 1;font-family: Arial, Helvetica, sans-serif;font-size: 12px; width: 100%; height: 100%; color: #000; font-size: 14px; }
.clear { clear: both; }
#wrapper { margin: 10px auto; width: 1000px; }
#wrapper a { text-decoration: none; color: #F48A00; }
#wrapper span.highlight { color: #F48A00; }
#header { border-bottom: 1px solid #ccc; margin-bottom: 20px; }
#header .top { border-bottom: 1px solid #ccc; margin-bottom: 10px; }
#header ul.navigation { list-style: none; text-align: right; }
#header .navigation li { display: inline }
#header .navigation li a { display: inline-block; padding: 10px 15px; border-left: 1px solid #ccc; }
#header h2 { font-family: &#39;Irish Grover&#39;, cursive; font-size: 92px; text-align: center; line-height: 110px; }
#header h2 a { color: #000; }
#header h3 { text-align: center; font-family: &#39;La Belle Aurore&#39;, cursive; font-size: 24px; margin-bottom: 20px; font-weight: normal; }
.main-col { width: 700px; display: inline-block; float: left; border-right: 1px solid #ccc; padding: 20px; margin-bottom: 20px; }
.sidebar { width: 239px; padding: 10px; display: inline-block; }
.main-col a { color: #F48A00; }
.main-col h1,
.main-col h2
{ line-height: 1.2em; font-size: 32px; margin-bottom: 10px; font-weight: normal; color: #F48A00; }
.main-col p { line-height: 1.5em; margin-bottom: 20px; }
#footer { border-top: 1px solid #ccc; clear: both; text-align: center; padding: 10px; color: #aaa; }
Salin selepas log masuk

Bundler模板–level 2

现在我们为blog bundler 创建模板, 创建src/Blogger/BlogBundle/Resources/views/layout.html.twig 并加入:

{# src/Blogger/BlogBundle/Resources/views/layout.html.twig #}
{% extends &#39;::base.html.twig&#39; %}
{% block sidebar %}
Sidebar content
{% endblock %}
Salin selepas log masuk

非常简单的代码,1. 继承了一级模板, 并且为博客内容特别定制了侧边栏, 很显然我们并不想博客的布局与其它页面一样。 类似drupal7中page–content-type.tpl.php模板, 定制了某一特殊类型内容的布局。

具体页面布局–level 3

这个阶段已经涉及到创建具体页面, 所以需要先创建控制器src/Blogger/BlogBundle/Controller/PageController.php

// src/Blogger/BlogBundle/Controller/PageController.php
namespace Blogger\BlogBundle\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\Controller;
class PageController extends Controller
{
public function indexAction()
{
return $this->render(&#39;BloggerBlogBundle:Page:index.html.twig&#39;);
}
}
Salin selepas log masuk

然后创建相应的Twig文件: src/Blogger/BlogBundle/Resources/views/Page/index.html.twig

{# src/Blogger/BlogBundle/Resources/views/Page/index.html.twig #}
{% extends &#39;BloggerBlogBundle::layout.html.twig&#39; %}
{% block body %}
Blog homepage
{% endblock %}
Salin selepas log masuk

创建路由将首页引导到我们刚创建的页面:src/Blogger/BlogBundle/Resources/config/routing.yml

# src/Blogger/BlogBundle/Resources/config/routing.yml
BloggerBlogBundle_homepage:
pattern: /
defaults: { _controller: BloggerBlogBundle:Page:index }
requirements:
_method: GET
Salin selepas log masuk

再次访问 http://symfony/app_dev.php可以看见简单的首页。

四、再创建一个about页面

路由:在src/Blogger/BlogBundle/Resources/config/routing.yml中加入

# src/Blogger/BlogBundle/Resources/config/routing.yml
BloggerBlogBundle_about:
pattern:  /about
defaults: { _controller: BloggerBlogBundle:Page:about }
requirements:
_method:  GET
Salin selepas log masuk

当以get方式访问about页时执行位于BloggerBlogBundle命名空间的page控制器about动作。

控制器: 在src/Blogger/BlogBundle/Controller/PageController.php 于page控制器中加入about动作

// src/Blogger/BlogBundle/Controller/PageController.php
// ..
public function aboutAction()
{
return $this->render(&#39;BloggerBlogBundle:Page:about.html.twig&#39;);
}
// ..
Salin selepas log masuk

模板: 创建src/Blogger/BlogBundle/Resources/views/Page/about.html.twig 并加入相关页面文件

{# src/Blogger/BlogBundle/Resources/views/Page/about.html.twig #}
{% extends &#39;BloggerBlogBundle::layout.html.twig&#39; %}
{% block body %}
about page
{% endblock %}
Salin selepas log masuk

简单的三个流程增加了关于页面:http://symfony/app_dev.php/about

相关推荐:

详解Symfony在模板和行为中取得request参数的方法

详解Symfony模板快捷变量的用法

简述Symfony核心类

Atas ialah kandungan terperinci 详解Symfony2框架创建项目和设置模板. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1662
14
Tutorial PHP
1262
29
Tutorial C#
1235
24
Bolehkah AI menakluki teorem terakhir Fermat? Ahli matematik melepaskan 5 tahun kerjayanya untuk mengubah 100 halaman bukti menjadi kod Bolehkah AI menakluki teorem terakhir Fermat? Ahli matematik melepaskan 5 tahun kerjayanya untuk mengubah 100 halaman bukti menjadi kod Apr 09, 2024 pm 03:20 PM

Teorem terakhir Fermat, akan ditakluki oleh AI? Dan bahagian yang paling bermakna dari keseluruhannya ialah Teorem Terakhir Fermat, yang akan diselesaikan oleh AI, dengan tepat untuk membuktikan bahawa AI tidak berguna. Suatu ketika dahulu, matematik tergolong dalam alam kecerdasan manusia yang tulen kini, wilayah ini dihuraikan dan diinjak oleh algoritma canggih. Imej Teorem Terakhir Fermat ialah teka-teki "terkenal" yang telah membingungkan ahli matematik selama berabad-abad. Ia telah terbukti pada tahun 1993, dan kini ahli matematik mempunyai rancangan besar: untuk mencipta semula bukti menggunakan komputer. Mereka berharap bahawa sebarang ralat logik dalam versi bukti ini boleh disemak oleh komputer. Alamat projek: https://github.com/riccardobrasca/flt

Kongsi cara mudah untuk membungkus projek PyCharm Kongsi cara mudah untuk membungkus projek PyCharm Dec 30, 2023 am 09:34 AM

Kongsi kaedah pembungkusan projek PyCharm yang mudah dan mudah difahami Dengan populariti Python, semakin ramai pembangun menggunakan PyCharm sebagai alat utama untuk pembangunan Python. PyCharm ialah persekitaran pembangunan bersepadu yang berkuasa yang menyediakan banyak fungsi mudah untuk membantu kami meningkatkan kecekapan pembangunan. Salah satu fungsi penting ialah pembungkusan projek. Artikel ini akan memperkenalkan cara untuk membungkus projek dalam PyCharm dengan cara yang mudah dan mudah difahami, dan memberikan contoh kod khusus. Mengapa projek pakej? Dibangunkan dalam Python

Petua Praktikal PyCharm: Tukar Projek kepada Fail EXE Boleh Laku Petua Praktikal PyCharm: Tukar Projek kepada Fail EXE Boleh Laku Feb 23, 2024 am 09:33 AM

PyCharm ialah persekitaran pembangunan bersepadu Python yang berkuasa yang menyediakan pelbagai alatan pembangunan dan konfigurasi persekitaran, membolehkan pembangun menulis dan menyahpepijat kod dengan lebih cekap. Dalam proses menggunakan PyCharm untuk pembangunan projek Python, kadangkala kita perlu membungkus projek ke dalam fail EXE boleh laku untuk dijalankan pada komputer yang tidak mempunyai persekitaran Python yang dipasang. Artikel ini akan memperkenalkan cara menggunakan PyCharm untuk menukar projek kepada fail EXE boleh laku dan memberikan contoh kod khusus. kepala

Melihat lebih dekat pada PyCharm: cara cepat untuk memadamkan projek Melihat lebih dekat pada PyCharm: cara cepat untuk memadamkan projek Feb 26, 2024 pm 04:21 PM

Tajuk: Ketahui lebih lanjut tentang PyCharm: Cara yang cekap untuk memadamkan projek Dalam beberapa tahun kebelakangan ini, Python, sebagai bahasa pengaturcaraan yang berkuasa dan fleksibel, telah digemari oleh semakin ramai pembangun. Dalam pembangunan projek Python, adalah penting untuk memilih persekitaran pembangunan bersepadu yang cekap. Sebagai persekitaran pembangunan bersepadu yang berkuasa, PyCharm menyediakan pembangun Python dengan banyak fungsi dan alatan yang mudah, termasuk memadamkan direktori projek dengan cepat dan cekap. Berikut akan memberi tumpuan kepada cara menggunakan padam dalam PyCharm

Bagaimana untuk membuat folder pada Telefon Realme? Bagaimana untuk membuat folder pada Telefon Realme? Mar 23, 2024 pm 02:30 PM

Tajuk: Panduan Pemula Telefon Realme: Bagaimana Membuat Folder pada Telefon Realme? Dalam masyarakat hari ini, telefon bimbit telah menjadi alat yang sangat diperlukan dalam kehidupan manusia. Sebagai jenama telefon pintar popular, Telefon Realme digemari pengguna kerana sistem pengendaliannya yang ringkas dan praktikal. Dalam proses menggunakan telefon Realme, ramai orang mungkin menghadapi situasi di mana mereka perlu mengatur fail dan aplikasi pada telefon mereka, dan mencipta folder ialah cara yang berkesan. Artikel ini akan memperkenalkan cara membuat folder pada telefon Realme untuk membantu pengguna mengurus kandungan telefon mereka dengan lebih baik. Tidak.

Bagaimana untuk mencipta seni piksel dalam GIMP Bagaimana untuk mencipta seni piksel dalam GIMP Feb 19, 2024 pm 03:24 PM

Artikel ini akan menarik minat anda jika anda berminat menggunakan GIMP untuk penciptaan seni piksel pada Windows. GIMP ialah perisian penyuntingan grafik terkenal yang bukan sahaja percuma dan sumber terbuka, tetapi juga membantu pengguna mencipta imej dan reka bentuk yang cantik dengan mudah. Selain sesuai untuk pemula dan pereka profesional, GIMP juga boleh digunakan untuk mencipta seni piksel, satu bentuk seni digital yang menggunakan piksel sebagai satu-satunya blok bangunan untuk melukis dan mencipta. Cara Membuat Seni Piksel dalam GIMP Berikut ialah langkah utama untuk mencipta gambar piksel menggunakan GIMP pada PC Windows: Muat turun dan pasang GIMP, kemudian lancarkan aplikasi. Buat imej baharu. Ubah saiz lebar dan tinggi. Pilih alat pensel. Tetapkan jenis berus kepada piksel. sediakan

Cara mencipta keluarga dengan Gree+ Cara mencipta keluarga dengan Gree+ Mar 01, 2024 pm 12:40 PM

Ramai rakan menyatakan bahawa mereka ingin tahu cara membuat keluarga dalam perisian Gree+ Berikut adalah kaedah operasi untuk anda Rakan yang ingin mengetahui lebih lanjut, datang dan lihat dengan saya. Mula-mula, buka perisian Gree+ pada telefon mudah alih anda dan log masuk. Kemudian, dalam bar pilihan di bahagian bawah halaman, klik pilihan "Saya" di hujung kanan untuk memasuki halaman akaun peribadi. 2. Selepas datang ke halaman saya, terdapat pilihan "Buat Keluarga" di bawah "Keluarga". 3. Seterusnya lompat ke halaman untuk mencipta keluarga, masukkan nama keluarga yang akan ditetapkan dalam kotak input mengikut gesaan, dan klik butang "Simpan" di penjuru kanan sebelah atas selepas memasukkannya. 4. Akhir sekali, gesaan "simpan berjaya" akan muncul di bahagian bawah halaman, menunjukkan bahawa keluarga telah berjaya dibuat.

Cara membuat carta Gantt menggunakan Highcharts Cara membuat carta Gantt menggunakan Highcharts Dec 17, 2023 pm 07:23 PM

Cara menggunakan Highcharts untuk mencipta carta Gantt memerlukan contoh kod khusus Pengenalan: Carta Gantt ialah bentuk carta yang biasa digunakan untuk memaparkan kemajuan projek dan pengurusan masa secara visual boleh memaparkan masa mula, masa tamat dan kemajuan tugas. Highcharts ialah perpustakaan carta JavaScript yang berkuasa yang menyediakan jenis carta kaya dan pilihan konfigurasi yang fleksibel. Artikel ini akan memperkenalkan cara menggunakan Highcharts untuk mencipta carta Gantt dan memberikan contoh kod khusus. 1. Carta tinggi

See all articles