kyletruman 发表于 2017-1-26 20:22:23

朗文5高级双解@基本上所有的电子词典缺条形图

本帖最后由 kyletruman 于 2017-1-26 20:57 编辑

有道和海词的电子数据来源中也缺条形柱状图，纸质词典是有的，比如查absolute，
发现论坛上LDOCE6和LDOCE5两个mdx也缺条形柱状图，自然地数据就缺了一大截，其实在朗文5双解中，柱状图还比较多。目前我感到比较棘手的是，这些柱状图怎么添加到TXT中去？是不是先把这些缺的编辑成html，然后转成TXT？(听说把docx转成TXT不太理想)

ipakk 发表于 2017-1-28 22:43:30

本帖最后由 ipakk 于 2017-1-28 22:46 编辑

向右的柱状图<div id="bar-chart" class="graphic"></div>
脚注 <div id="footer">
(刚观察CNN某网站的源码和框架偶然发现：Refugees from countries targeted in Trump's order，源码和框架在这里看：<!DOCTYPE html>
<!--> <html class="lt-ie9 lt-ie8"> <!-->
<!--> <html class="lt-ie9"> <!-->
<!--> <html class="ie9" lang="en-US"> <!-->
<!--><!--> <html lang="en-US"> <!--<!-->
<head>

<meta charset="utf-8">
<meta name="robots" content="noindex">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">

<title>CNN : Graphic : Refugees from countries targeted in Trump's order</title>

<meta name="title" content="Refugees from countries targeted in Trump's order">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="news_keywords" content="">
<meta name="section" content="">
<meta name="source" content="CNN">
<meta name="subsection" content="">
<meta name="application-name" content="CNN">

<!-- Facebook settings -->
<meta property="og:description" content="">
<meta property="og:image" content="">
<meta property="og:type" content="">
<meta property="og:title" content="Refugees from countries targeted in Trump's order">
<meta property="og:url" content="">
<meta property="fb:admins" content="690014395">
<meta property="fb:app_id" content="80401312489">

<!-- Twitter card settings -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@cnn">
<meta name="twitter:site:id" content="759251">
<meta name="twitter:creator" content="@cnn">
<meta name="twitter:title" content="Refugees from countries targeted in Trump's order">
<meta name="twitter:description" content="">

<link rel="canonical" href="">
<link rel="shortcut icon" href="//cnn.com/favicon.ie9.ico">
<link rel="apple-touch-icon" href="//i.cdn.turner.com/cnn/.e/img/3.0/global/misc/apple-touch-icon.png">
<link rel="stylesheet" type="text/css" href="css/graphic-header.css?1485524128" />

<base target="_blank">

</head>

<body>
<header>
    <!-- javascripts -->
   
    <script type="text/javascript" src="js/graphic-header.js?1485524128"></script>
    <script type="text/javascript" src="//z.cdn.turner.com/cnn/.e/js/libs/jquery-1.9.1.min.js"></script>
</header>

<section>


<div id="meta">
    <h1 class="hed">Refugees from countries targeted in Trump's order</h1>
    <h2 class="dek">In fiscal 2016, US admitted 36,722 refugees from Iraq, Iran, Syria, Yemen, Sudan, Somalia and Libya.</h2>
</div>

<div id="bar-chart" class="graphic"></div>

<div id="footer">
   
    <p class="source">Source: Refugee Processing Center / US State Department’s Bureau of Population, Refugees and Migration</p>
</div>

<script type="text/javascript">
    var DATA = [{"label": "Syria", "amt": "12587"}, {"label": "Iraq", "amt": "9880.0"}, {"label": "Somalia", "amt": "9020"}, {"label": "Iran", "amt": "3750.0"}, {"label": "Sudan", "amt": "1458"}, {"label": "Yemen", "amt": "26"}, {"label": "Libya", "amt": "1"}];
</script>


</section>

<footer>
<!-- javascripts -->
<script src="//z.cdn.turner.com/cnn/.e/interactive/js/lib/vendor/pym/pym.v1.min.js"></script>
<script src="//z.cdn.cnn.com/cnn/.e/interactive/js/lib/vendor/d3/d3-4.3.0-min.js"></script>





<script type="text/javascript" src="js/graphic-footer.js?1485524128"></script>

</footer>
</body>
</html>


好像还要画图，用什么工具画？{:4_101:}有谁知道吗，可否推荐一个比较好的工具，谢谢！

ipakk 发表于 2017-1-28 23:03:51

继续看一下，不知是不是要在js脚本中像CNN网页那样添加每个条形柱状图的某些值？比如CNN添加的：<script type="text/javascript">
    var DATA = [{"label": "Syria", "amt": "12587"}, {"label": "Iraq", "amt": "9880.0"}, {"label": "Somalia", "amt": "9020"}, {"label": "Iran", "amt": "3750.0"}, {"label": "Sudan", "amt": "1458"}, {"label": "Yemen", "amt": "26"}, {"label": "Libya", "amt": "1"}];
</script>
可是坐标上的值又怎么添加？

lxchen2001 发表于 2017-1-29 16:45:43

本帖最后由 lxchen2001 于 2017-1-29 22:10 编辑

重点是在数据

var DATA = .....

呈现方法可以用Javascript: (JQuery +) 外挂第三方画图插件

(朗文5有图可下）

mdx痴迷者 发表于 2017-1-29 17:00:28

lxchen2001 发表于 2017-1-29 16:45
重点是在数据

var DATA = .....


lxchen2001大人，请教一下，您是用哪一个外挂第三方画图插件画出图的，我想学，谢谢！{:4_97:}

lxchen2001 发表于 2017-1-30 05:16:21

本帖最后由 lxchen2001 于 2017-1-30 04:37 编辑

mdx痴迷者 发表于 2017-1-29 10:00
lxchen2001大人，请教一下，您是用哪一个外挂第三方画图插件画出图的，我想学，谢谢！

网上搜搜，可以找到N多.

https://www.amcharts.com/
http://www.chartjs.org
http://highcharttable.org/
http://canvasjs.com/html5-javascript-bar-chart/
https://plot.ly/javascript/
https://d3js.org/
http://www.jchartfx.com/

中文的：
http://www.echartsjs.com

Okya 发表于 2019-9-24 19:07:59



谢谢楼主。。。。

{:13_462:}
页: [1]
查看完整版本: 朗文5高级双解@基本上所有的电子词典缺条形图