QML Charts 往图表上添加文字

旧城等待， 2021-11-02 10:46 592阅读 0赞

### 内容： ###

*  给所有点都加上标签（XYseries 自带)
 *  给指定的个别点添加任何需要显示的内容

### 1、给所有点都添加标签 ###

效果如下图  
![显示每个点的标签][20190813155106681.gif]

ChartView {
    	anchor.fill: parent
    	ValueAxis {
    		id:axisX
    		max:10
    		min:0
    		tickCount: 10
    	}
    	ValueAxis {
    		id: axisY
    		max: 10
    		min: 0
    		tickCount: 10
    	}
    	LineSeries {
    		id: series0
    		axisX: axisX
    		axisY: axisY
    	}
    	ScatterSeries {
    		id: series1
    		axisX: axisX
    		axisY: axisY
    		markerSize: 10
    	    pointLabelFormat: "(@xPoint Hz, @yPoint dB)"
    	    pointLabelVisible: true
    	}
    }

> @xPoint The x value of the data point  
> @yPoint The y value of the data point
> 
> > series->setPointLabelsFormat("(@xPoint, @yPoint)");

***核心：pointLabelFormat: “(@xPoint Hz, @yPoint dB)” 和 pointLabelVisible: true 这两句话***

--------------------

### 2、给需要的点添加想要的标签 ###

效果图  
![指定点显示文本][20190813155050496.gif]

ScatterSeries {
    	id: series1
    	axisX: axisX
    	axisY: axisY
    	onPointAdded: updatePointPosition()
    }
    
    Text {
    	id: name
    	text: qsTr("text")
    }
    
    function updatePointPosition() {
    	var p = myCharts.mapToPosition(series1.at(3), series1);
    	name.x = p.x;
    	name.y = p.y;
    }

这边利用 mapToPosition 来获取指定点的坐标，然后把它移动过去

[20190813155106681.gif]: /images/20211101/8b1de9ac35f94a06a8d609a16e7e59a7.png
[20190813155050496.gif]: /images/20211101/bc6f8018a67240609077d4f22aadd35b.png

发表评论取消回复

表情：

评论列表（有 0 条评论，592人围观）

还没有评论，来说两句吧...

相关阅读

相关 Chart.xkcd图表库

> Chart.xkcd是一个图表库，绘制“粗略”，“卡通”或“手绘”样式的图表。安装 CDN <script src="https://cdn.jsd

客官°小女子只卖身不卖艺/ 2024年04月06日 11:11/ 0 赞/ 14 阅读

相关 v-charts 图表使用

安装： npm i v-charts echarts -S 入口文件 main.js里面： import VCharts from 'v-charts' Vue.u

朱雀/ 2023年05月30日 06:03/ 0 赞/ 192 阅读

相关 v-charts环形图中间设置文字

![在这里插入图片描述][20200928173527803.png_pic_center] 主要是在`chartExtend`中设置`graphic`，代码如下：

本是古典何须时尚/ 2022年12月11日 05:25/ 0 赞/ 367 阅读

相关 Javascript图表库: Dojo Charting

[![image][]][image 1] Dojo Charting是在Dojox目录下的一个图表工程，提供了众多的图表类型、定制选项以及各种主题。作为Dojo最强大的功能

谁借莪１个温暖的怀抱￠/ 2022年04月22日 12:10/ 0 赞/ 186 阅读

相关 wx-charts图表滑动功能

插件下载地址已经api文档 [https://github.com/xiaolin3303/wx-charts][https_github.com_xiaolin3303_w

￡神魔★判官ぃ/ 2022年04月05日 11:12/ 0 赞/ 396 阅读

相关 openlayes 3 根据视野在建筑物上添加文字

1. 先将图层发布成geoserver服务 2.具体实现代码 var tempUrl = '' //发布的wfs图层 var poi_style

谁借莪１个温暖的怀抱￠/ 2022年03月30日 04:12/ 0 赞/ 144 阅读

相关 chart图表

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

Bertha 。/ 2022年01月27日 15:39/ 0 赞/ 290 阅读

相关 QML Charts 往图表上添加文字

内容：给所有点都加上标签（XYseries 自带) 给指定的个别点添加任何需要显示的内容 1、给所有点都添加标签效果如下图 ![显示每个点的标

旧城等待，/ 2021年11月02日 10:46/ 0 赞/ 593 阅读

相关 echart chart morisjs 图表重叠

var qname = []; var qc = []; var nums = []; $.ajax({ type: 'POST

小灰灰/ 2021年10月08日 06:00/ 0 赞/ 314 阅读

相关 C#--图表控件（Chart）

Chart的属性 1、Serial属性： Series是画在ChartArea上的线、点、柱形、条形、饼图，简单点儿说就是画在上面的数据，直接说属性： 1.1、

客官°小女子只卖身不卖艺/ 2021年09月27日 16:58/ 0 赞/ 1167 阅读