javascript - 如何在 Teechart for HTML5/Javascript 中使轴标签美观-6ren

javascript - 如何在 Teechart for HTML5/Javascript 中使轴标签美观

转载作者：行者123 更新时间：2023-11-28 18:36:11

我想让我的底轴标签在画线时漂亮。数据大概是这样的:

[0.75,1.5,2.25,3,3.75,4.5,5.25,6,6.75]

但我想看到标签像这样显示:

1 2 3 4 5 6

谢谢!

<!DOCTYPE html>
<html>
<head>
<title>TeeChart JavaScript Line Series Example</title>

<!--[if lt IE 9]>
    <script src="https://www.steema.com/files/public/teechart/html5/latest/src/excanvas/excanvas_text.js"></script>
    <script src="https://www.steema.com/files/public/teechart/html5/latest/src/excanvas/canvas.text.js"></script>
<![endif]-->

<script src="https://www.steema.com/files/public/teechart/html5/latest/src/teechart.js" type="text/javascript"></script>

<script type="text/javascript">
var Chart1;
function draw() {
  Chart1=new Tee.Chart("canvas");
  var series = Chart1.addSeries(new Tee.Line());

var data = {
      "xvalues" : [ 0.5, 1.5, 2.5, 3.5, 4.5, 5.5, 6.5, 7.5, 8.5, 9.5, 10.5, 11.5, 12.5, 13.5, 14.5, 15.5,
          16.5, 17.5, 18.5, 19.5, 20.5, 21.5, 22.5, 23.5, 24.5, 25.5, 26.5, 27.5, 28.5, 29.5, 30.5,
          31.5, 32.5, 33.5, 34.5, 35.5, 36.5, 37.5, 38.5, 39.5, 40.5, 41.5, 42.5, 43.5, 44.5, 45.5,
          46.5, 47.5, 48.5, 49.5, 50.5, 51.5, 52.5, 53.5, 54.5, 55.5, 56.5, 57.5, 58.5, 59.5, 60.5,
          61.5, 62.5, 63.5, 64.5, 65.5, 66.5, 67.5, 68.5, 69.5, 70.5, 71.5, 72.5, 73.5, 74.5, 75.5,
          76.5, 77.5, 78.5, 79.5, 80.5, 81.5, 82.5, 83.5, 84.5, 85.5, 86.5, 87.5, 88.5, 89.5, 90.5,
          91.5, 92.5, 93.5, 94.5, 95.5, 96.5, 97.5, 98.5, 99.5, 100.5, 101.5, 102.5, 103.5,
          104.5, 105.5, 106.5, 107.5, 108.5, 109.5, 110.5, 111.5, 112.5, 113.5, 114.5, 115.5,
          116.5, 117.5, 118.5, 119.5, 120.5, 121.5, 122.5, 123.5, 124.5, 125.5, 126.5, 127.5,
          128.5, 129.5, 130.5, 131.5, 132.5, 133.5, 134.5, 135.5, 136.5, 137.5, 138.5, 139.5,
          140.5, 141.5, 142.5, 143.5, 144.5, 145.5, 146.5, 147.5, 148.5, 149.5, 150.5, 151.5,
          152.5, 153.5, 154.5, 155.5, 156.5, 157.5, 158.5, 159.5, 160.5, 161.5, 162.5, 163.5,
          164.5, 165.5, 166.5, 167.5, 168.5, 169.5, 170.5, 171.5, 172.5, 173.5, 174.5, 175.5,
          176.5, 177.5, 178.5, 179.5, 180.5, 181.5, 182.5, 183.5, 184.5, 185.5, 186.5, 187.5,
          188.5, 189.5, 190.5, 191.5, 192.5, 193.5, 194.5, 195.5, 196.5, 197.5, 198.5, 199.5,
          200.5, 201.5, 202.5, 203.5, 204.5, 205.5, 206.5, 207.5, 208.5, 209.5, 210.5, 211.5,
          212.5, 213.5, 214.5, 215.5, 216.5, 217.5, 218.5, 219.5, 220.5, 221.5, 222.5, 223.5,
          224.5, 225.5, 226.5, 227.5, 228.5, 229.5, 230.5, 231.5, 232.5, 233.5, 234.5, 235.5,
          236.5, 237.5, 238.5, 239.5, 240.5, 241.5, 242.5, 243.5, 244.5, 245.5, 246.5, 247.5,
          248.5, 249.5, 250.5, 251.5, 252.5, 253.5, 254.5, 255 ],
      "yvalues" : [ 2.098175287246704, 2.098175287246704,
          2.1077122688293457, 2.0409531593322754, 1.7548420429229736,
          1.2970644235610962, 1.5927125215530396, 1.812064290046692,
          -0.39099061489105225, -2.1744160652160645,
          -3.3856191635131836, -3.8433966636657715,
          0.4768794775009155, 1.1921570301055908,
          -1.8310829401016235, 0.03817594051361084,
          1.1063237190246582, -0.34330546855926514,
          -0.8201571702957153, -0.15256476402282715,
          0.20984256267547607, -0.9536756277084351,
          -0.9632126092910767, -1.6308048963546753,
          -1.7833975553512573, 0.2861388325691223,
          -0.3623795509338379, -0.07626843452453613,
          0.4387313723564148, -0.9822865724563599,
          1.1921570301055908, 3.0518786907196045, 2.451045513153076,
          3.36660099029541, 4.329841136932373, 3.3761377334594727,
          2.489193916320801, 2.7753047943115234, 2.2412309646606445,
          0.08586108684539795, -1.4209903478622437,
          -3.1376562118530273, -3.2044153213500977,
          0.8488238453865051, 0.2861388325691223, -2.002749443054199,
          0.61039799451828, 0.5531758069992065, -1.1444164514541626,
          -1.106268286705017, -0.7343238592147827,
          -0.3146944046020508, -1.2207127809524536,
          -1.993212342262268, -2.0981197357177734,
          -1.9073792695999146, -1.3160828351974487,
          -1.411453366279602, -0.8201571702957153,
          -1.182564616203308, -2.0218234062194824,
          0.31474989652633667, 1.9932680130004883,
          1.5354902744293213, 2.584564208984375, 3.395212173461914,
          2.00280499458313, 1.8502124547958374, 3.166323184967041,
          2.0600271224975586, -0.5626572370529175,
          -1.5354348421096802, -3.757563591003418,
          -2.8896937370300293, 1.5354902744293213,
          -0.8201571702957153, -2.0504345893859863,
          1.1540089845657349, -0.6484905481338501,
          -1.7643235921859741, -0.7820090055465698,
          -0.9822865724563599, -0.5149720907211304,
          -1.4400643110275269, -2.1553421020507812,
          -2.307934284210205, -1.6212679147720337,
          -0.1716388463973999, -0.2574721574783325,
          -0.028583407402038574, -0.6389535665512085,
          -1.8883050680160522, 0.13354623317718506,
          1.5450273752212524, 1.087249755859375, 2.7657675743103027,
          3.519193649291992, 1.8025271892547607, 2.231693744659424,
          2.9565083980560303, 1.173082947731018,
          -0.24793505668640137, -1.2683979272842407,
          -3.194878578186035, -0.3242313861846924,
          2.8802120685577393, -0.3528425693511963,
          -0.14302778244018555, 2.155397415161133,
          0.5722498297691345, 0.0953981876373291, 0.4005832076072693,
          0.7916016578674316, -0.1621018648147583,
          -1.411453366279602, -0.9346016645431519,
          -1.4496015310287476, -0.42913877964019775,
          0.2003055214881897, -0.7724720239639282,
          0.18123137950897217, -1.1158052682876587,
          -1.7261754274368286, 1.2303051948547363,
          1.2970644235610962, 0.8488238453865051, 2.679934501647949,
          2.1077122688293457, 0.4005832076072693, 1.087249755859375,
          1.7643791437149048, 0.6962312459945679,
          -1.0490459203720093, -2.8801565170288086,
          -4.701729774475098, -1.5163606405258179, 1.430582880973816,
          -1.8310829401016235, -1.2207127809524536,
          1.5354902744293213, -0.2670091390609741,
          -1.4305273294448853, -0.486361026763916,
          0.2956758737564087, -0.6103423833847046,
          -1.8024717569351196, -2.0408973693847656,
          -2.441452980041504, -1.3446940183639526,
          -0.7343238592147827, -0.5149720907211304,
          0.3528980612754822, -1.1730273962020874,
          -0.219323992729187, 2.7180824279785156, 2.47965669631958,
          2.1935458183288574, 3.318915843963623, 3.0995640754699707,
          2.1077122688293457, 2.660860538482666, 3.0232677459716797,
          0.3338239789009094, -1.8978420495986938,
          -3.1376562118530273, -4.453766822814941,
          -0.5435832738876343, 0.6199350357055664,
          -3.1376562118530273, -0.8869165182113647,
          0.5436387658119202, -1.640342116355896,
          -1.0490459203720093, -0.38145363330841064,
          -0.3623795509338379, -0.8487683534622192,
          -1.3446940183639526, -1.3733052015304565,
          -1.5163606405258179, -0.5531201362609863,
          -0.410064697265625, -0.5912683010101318,
          -0.5149720907211304, -1.4782124757766724,
          -0.37191665172576904, 2.2889161109924316,
          2.2126197814941406, 1.8883605003356934, 3.8434524536132812,
          2.8706750869750977, 1.1635459661483765, 2.9469714164733887,
          2.9755825996398926, 0.6294720768928528,
          -0.23839807510375977, -2.317471504211426,
          -2.9278416633605957, 1.669008731842041, 1.3447495698928833,
          -1.0108977556228638, 1.6785458326339722,
          1.4591940641403198, -0.1621018648147583,
          -0.40052759647369385, -0.3146944046020508,
          0.6008609533309937, -0.9250646829605103,
          -1.6308048963546753, -1.6784902811050415,
          -2.508212089538574, -1.3542309999465942,
          -1.106268286705017, -0.46728694438934326,
          -0.23839807510375977, -2.6035823822021484,
          -0.6389535665512085, 1.974193811416626, 0.6580831408500671,
          1.9074347019195557, 2.8706750869750977, 0.8106757402420044,
          1.0204904079437256, 2.250767707824707, 1.2589162588119507,
          -0.9727495908737183, -2.6989526748657227,
          -4.58728551864624, -3.7194151878356934,
          0.22891658544540405, -1.2588609457015991,
          -2.8610825538635254, 0.0953981876373291,
          -1.0013607740402222, -2.918304920196533,
          -1.5449718236923218, -0.6389535665512085,
          -0.5245091915130615, -1.0776571035385132,
          -1.6784902811050415, -2.031360626220703,
          -1.3637679815292358, -0.30515730381011963,
          -0.2574721574783325, 0.8297497630119324,
          0.14308321475982666, -1.1730273962020874,
          1.3256754875183105, 2.7562308311462402, 2.098175287246704,
          3.2330822944641113, 3.748082160949707, 2.584564208984375,
          2.861138105392456, 3.137712001800537, 1.440119981765747,
          -0.1334906816482544 ]};

  series.data = {
    labels : data.xvalues,
    values : data.yvalues
  };

  Chart1.axes.left.title.text="Y";

  //Chart1.series.items[0].marks.drawEvery=120;

  Chart1.title.text="TeeChart for JavaScript";
  Chart1.title.format.font.style="18px Verdana";

  Chart1.title.format.font.gradient.visible=true;
  Chart1.legend.visible=false;

  Chart1.draw();
}
</script>
</head>
<body onload="draw()">

<center>
<br><canvas id="canvas" width="600" height="400">
This browser does not seem to support HTML5 Canvas.
</canvas>
</center>
</body>
</html>

最佳答案

尝试将轴增量设置为 1:

Chart1.axes.bottom.increment = 1;

关于javascript - 如何在 Teechart for HTML5/Javascript 中使轴标签美观，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37040431/

文章推荐： JavaScript - 将 for 循环中的多个结果推送到数组中

文章推荐： jQuery UI-Slider 没有 'live' 效果和 CSS 样式

文章推荐： javascript - WeakMap 能让我避免父/子关系的内存泄漏吗？

javascript - 我需要将文本放在一个中，它位于一个 Div 中，该 Div 位于另一个 Div 中，该 Div 位于另一个 Div 中
我需要将文本放在中在一个 Div 中，在另一个 Div 中，在另一个 Div 中。所以这是它的样子: #document Change PIN
html - 两个背景图像。一个在 HTML 中，一个在 BODY 中。在 Firefox 中，主体图像未呈现
奇怪的事情发生了。我有一个基本的 html 代码。 html，头部， body 。(因为我收到了一些反对票，这里是完整的代码) 这是我的CSS: html { backgroun
ios - 将图像从 asset.xcassets 加载到 imageArray 中，并将其动态加载到 UIImageView 中，该 UIImageView 存在于 UICollectionView 中 - swift
我正在尝试将 Assets 中的一组图像加载到 UICollectionview 中存在的 ImageView 中，但每当我运行应用程序时它都会显示错误。而且也没有显示图像。我在ViewDidLoa
linux - 在 BASH 中，我需要根据 perl 脚本的输出更改一些环境变量。在 tcsh 中，我可以使用别名 eval 组合。不能在 bash 中
我需要根据带参数的 perl 脚本的输出更改一些环境变量。在 tcsh 中，我可以使用别名命令来评估 perl 脚本的输出。 tcsh: alias setsdk 'eval `/localhome/
asp.net - Windows 身份验证适用于 IIS，但不适用于 Kestrel/Microsoft.AspNetCore.Authentication.Negotiate(不在 Chrome 中，有时在 Edge 中，始终在 IE 中)？
我使用 Windows 身份验证创建了一个新的 Blazor(服务器端)应用程序，并使用 IIS Express 运行它。它将显示一条消息“Hello Domain\User!”来自右上方的以下 Ra
java - java 中 Kotlin 中的等价物是什么？
这是我的方法 void login(Event event);我想知道 Kotlin 中应该如何最佳答案在 Kotlin 中通配符运算符是 * 。它指示编译器它是未知的，但一旦知道，就不会有其他类
express - 在 Jade 中，为什么有时我可以按原样使用变量而有时必须将它们包含在#{......} 中？
看下面的代码 for story in book if story.title.length < 140 - var story
c - C 中 strstr() 中 for 循环的错误使用
我正在尝试用 C 语言学习字符串处理。我写了一个程序，它存储了一些音乐轨道，并帮助用户检查他/她想到的歌曲是否存在于存储的轨道中。这是通过要求用户输入一串字符来完成的。然后程序使用 strstr()
c - * 在 sscanf 中，* 在 [] 中
我正在学习 sscanf 并遇到如下格式字符串: sscanf("%[^:]:%[^*=]%*[*=]%n",a,b,&c); 我理解 %[^:] 部分意味着扫描直到遇到 ':' 并将其分配给 a。:
python - 在 Python (2.7.3) 中，如果 str(x) 中的任何字符在 str(y) 中(或 str(y) 在 str(x) 中)，我如何编写一个函数来回答？
def char_check(x,y): if (str(x) in y or x.find(y) > -1) or (str(y) in x or y.find(x) > -1):
ansible - 在 Ansible 中，如何将一行移动到一个 block 中？
我有一种情况，我想将文本文件中的现有行包含到一个新 block 中。 line 1 line 2 line in block line 3 line 4 应该变成 line 1 line 2 line
Django 调试工具栏显示在根 URL 中，但不显示在应用程序 URL 中
我有一个新项目，我正在尝试设置 Django 调试工具栏。首先，我尝试了快速设置，它只涉及将 'debug_toolbar' 添加到我的已安装应用程序列表中。有了这个，当我转到我的根 URL 时，调试
r - 在 R 中，Matlab 中 @ 函数句柄的等价物是什么？
在 Matlab 中，如果我有一个函数 f，例如签名是 f(a,b,c)，我可以创建一个只有一个变量 b 的函数，它将使用固定的 a=a1 和 c=c1 调用 f: g = @(b) f(a1, b,
swiftui - SwiftUI 中 ScrollView 中 VStack 元素中的神秘间距或填充
我不明白为什么 ForEach 中的元素之间有多余的垂直间距在 VStack 里面在 ScrollView 里面使用 GeometryReader 时渲染自定义水平分隔线。 Scrol
cookies - 什么应该存储在 session 中，什么应该存储在 cookie 中？
我想知道，是否有关于何时使用 session 和 cookie 的指南或最佳实践？什么应该和什么不应该存储在其中？谢谢! 最佳答案这些文档很好地了解了 session cookie 的安全问题以及
python - Python 中 matplotlib 中 3d 直方图的奇怪行为
我在 scipy/numpy 中有一个 Nx3 矩阵，我想用它制作一个 3 维条形图，其中 X 轴和 Y 轴由矩阵的第一列和第二列的值、高度确定每个条形的是矩阵中的第三列，条形的数量由 N 确定。
c - c 中 sem_init(...) 中 value 参数的不同用法
假设我用两种不同的方式初始化信号量 sem_init(&randomsem,0,1) sem_init(&randomsem,0,0) 现在， sem_wait(&randomsem) 在这两种情况下
c - 实际值存储在 pstr 中，但是该值如何存储在数组 "WORD"中
我怀疑该值如何存储在“WORD”中，因为 PStr 包含实际输出。？既然Pstr中存储的是小写到大写的字母，那么在printf中如何将其给出为“WORD”。有人可以吗？解释一下？ #include
javascript - 数组索引选择像在 numpy 中，但在 javascript 中
我有一个 3x3 数组: var my_array = [[0,1,2], [3,4,5], [6,7,8]]; 并想获得它的第一个 2
javascript - 在 Javascript 中，如何检测浏览器窗口何时在 View 中？
我意识到您可以使用如下方式轻松检查焦点: var hasFocus = true; $(window).blur(function(){ hasFocus = false; }); $(win

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 如何在 Teechart for HTML5/Javascript 中使轴标签美观